如何解决当我在p-table中使用<p-cellEditor>进行聚焦并单击时,如何将pEditableColumn列保持在编辑模式下?
我有一个使用priming组件的表,在p-celleditor中,我有一个在pTemplate="input"
中是模式的组件,但是当我与模式交互时,pTemplate="input"
是关闭的,此故障不会保存我的当前值。在我发送事件将其关闭之前,将pEditableColumn
保留在版本模型中的更好方法是什么?
这是示例:
https://stackblitz.com/edit/github-yxy3bm-jnuaak?file=src%2Fapp%2Fapp.module.ts
<p-table [value]="dates">
<ng-template pTemplate="header">
<tr>
<th>Date</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData>
<tr>
<td pEditableColumn>
<p-cellEditor>
<ng-template pTemplate="input">
<p-calendar appendTo="body" [(ngModel)]="rowData.date" [showIcon]="true" [monthNavigator]="true" [yearNavigator]="true" yearRange="2000:2030"></p-calendar>
<button type="button" class="btn btn-primary" (click)="openModal(template)">Create template modal</button>
</ng-template>
<ng-template pTemplate="output">
{{rowData.date}}
</ng-template>
</p-cellEditor>
</td>
</tr>
</ng-template>
</p-table>
<ng-template #template>
<div class="modal-header">
<h4 class="modal-title pull-left">Modal for user id : {{ modalService.config.initialState.id }}</h4>
<button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()">
<span aria-hidden="true">×</span>
</button>
</div>
这是一个模态。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。