当我在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">&times;</span>
    </button>
</div>
这是一个模态。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)