NgModel с динамическими полями в Angular 2

Я пытаюсь выяснить, как повторно использовать тот же компонент / форму для модели с динамическими полями.

Предыстория: у меня есть форма, которая будет создавать новую запись, основанную на типе записи, форма будет иметь разные поля, я пытаюсь использовать то же самое create.component.ts и одни и те же методы для публикации разных данных.

Моя форма выглядит так:

<div *ngIf="activeType === 'type1'">

  <input class="input-field" type="text"
         [(ngModel)]="externalSubscription.firstName" placeholder="Enter first name">
  <input class="input-field" type="text"
         [(ngModel)]="externalSubscription.lastName" placeholder="Enter last name">
</div>

<div *ngIf="activeType === 'type2'">
  <input class="input-field" type="text"
         [(ngModel)]="externalSubscription.userName" placeholder="Enter User Name">
  <input class="input-field" type="text"
         [(ngModel)]="externalSubscription.userId" placeholder="Enter User Id">
</div>

Как видите, тип один и тип два имеют совершенно разные поля, но я пытаюсь использовать модель externalSubscription для привязки этих данных.

Для первой формы - я хотел бы инициализировать externalSubscription как:

externalSubscription = new ExternalSubscriptionType1(firstName, lastName);

и для второго это:

externalSubscription = new ExternalSubscriptionType1(userName, userId);

Есть ли хорошая практика для подобных случаев? Или я должен полностью разделить эти формы на другой компонент, который будет использовать разные классы?

Они оба используют один и тот же POST конечная точка в конце.

0 ответов

Другие вопросы по тегам