Добавить mat-datepicker на mat-input условно - PullRequest
Новая
       34

Добавить mat-datepicker на mat-input условно

0 голосов
/ 25 сентября 2019

Я бы хотел добавить сборщик даты материала условно, но без дублирования моего входного тега .

Например, если у меня есть это:

.ts: 

isDatePickerInputList: boolean[] = [false, true]

Простой способ состоит в том, чтобы иметь 2 входа в * ngFor: первый вход будет обычным, а второй - входом, связанным с matDatePicker

Но я не хочу, чтобы это решение , потому что это означало бы дублирование моего входного тега

.html: 

<ng-container *ngFor="let isDatePickerInput of isDatePickerInputList">

   <ng-container *ngIf="isDatePickerInput">
      <input [matDatepicker]="picker" matInput>
      <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
      <mat-datepicker #picker></mat-datepicker>
   </ng-container>

   <ng-container *ngIf="!isDatePickerInput">
      <input matInput>
   </ng-container>

</ng-container>

Я хочу что-то подобное (но, конечно, это не работает на самом деле): 

<ng-container *ngFor="let isDatePickerInput of isDatePickerInputList">

   <input [matDatepicker]="isDatePickerInput ? 'picker' : ''" matInput>
   <ng-container *ngIf="isDatePickerInput">
      <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
      <mat-datepicker #picker></mat-datepicker>
   </ng-container>
</ng-container>

1 Ответ

0 голосов
/ 25 сентября 2019 
<ng-container *ngFor="let isDatePickerInput of isDatePickerInputList">
    <ng-container *ngIf="isDatePickerInput"> text {{isDatePickerInput!.picker}} 
      <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
      <mat-datepicker #picker></mat-datepicker>
</ng-container>
</ng-container>

Не пытался, но точно не работал, я подумал, может быть, здесь вы найдете что-то полезное: синтаксис углового шаблона

...