Редактор ячеек данных не может редактировать нужную ячейку - PullRequest
Новая
       19

Редактор ячеек данных не может редактировать нужную ячейку

0 голосов
/ 12 декабря 2018

У меня есть таблица с ячейкой, в которой есть два редактируемых поля: выпадающий и календарь.Когда я нажимаю на календарь, фокус падает вниз.Я попытался (onFocus) = "clickCalendar ()" в календаре, чтобы сосредоточиться на календаре ввода, но это не помогло.Это способ обойти это.Любые указатели были бы очень полезны 

        <ng-template pTemplate="header" let-columns>             
            <tr >
                <th rowspan="2" class="border-right emp-name">Employee Name</th>
                <th rowspan="2" class="border-right" style="width:100px;">ID</th>
                <th *ngFor="let col of columns" class="border-right">{{col.header}}</th>                   
            </tr>
      </ng-template>

    <ng-template pTemplate="body"  let-rowData let-columns="columns" >      
          <tr>            
              <td class="border-right" style="text-align: center">{{rowData.searchName}}</td>
              <td class="border-right" style="text-align: center">{{rowData.patientIndex}}</td>

              <ng-container *ngIf="rowData.status=='A'">
                  <td *ngFor="let col of columns" pEditableColumn [ngSwitch]="col.field" class="border-right">
                      <div *ngSwitchCase="'sizeMask268'">
                        <p-cellEditor>
                          <ng-template pTemplate="input">                                
                            <p-dropdown appendTo="body" [options]="n95" [(ngModel)]="rowData[col.field]" [style]="{'width':'100%'}"  ></p-dropdown>
                            <p-calendar id="calendarInput" appendTo="body" [showIcon]="true"  [(ngModel)]="rowData.dateOf268"></p-calendar>
                          </ng-template>
                          <ng-template  pTemplate="output" >                             
                              <p-dropdown appendTo="body" [options]="n95" [(ngModel)]="rowData[col.field]" [style]="{'width':'100%'}" ></p-dropdown>
                             <p-calendar  appendTo="body" [showIcon]="true" [(ngModel)]="rowData.dateOf268" (onFocus)="clickCalendar()"></p-calendar>                            
                          </ng-template>
                        </p-cellEditor>  
                     </div>
                  </td>
                </ng-container>  
           </tr>
        </ng-template>

1 Ответ

0 голосов
/ 25 марта 2019

Измените <ng-container *ngIf="rowData.status=='A'"> на <ng-container *ngIf="rowData.status==='A'">

Что касается редактора ячеек и календаря, запишите их в отдельных шаблонах ng: 

<p-cellEditor>
   <ng-template pTemplate="input">                                
     <p-dropdown appendTo="body" [options]="n95" [(ngModel)]="rowData[col.field]" 
                                  [style]="{'width':'100%'}"  ></p-dropdown>
    </ng-template>
 <ng-template p-template="output" >
     {{rowDate[col.field]}}
 </ng-template>

...