Угловой - Реактивная форма определяет более одной пары выбора на основе одной ключевой величины - PullRequest
0 голосов
/ 29 октября 2018

Я немного новичок в магии реактивной формы Angular. Я не совсем уверен, как я могу сгенерировать два разных выбора на основе ключа (organizationId)?

Фиктивные данные, которые я получаю от API:

1: {
  Users: [
    {
      UserId: 3,
      FullName: 'Adam mc'
    },
    {
      UserId: 4,
      FullName: 'Peter mc'
    }
  ],
  OrganizationId: 1(the key)
},
2: {
  Users: [
    {
      UserId: 1,
      FullName: 'John mc'
    },
    {
      UserId: 2,
      FullName: 'Clade mc'
    }
  ],
  OrganizationId: 2(the key)
}

Моя структура:

// форма сборки , я думаю, что проблема здесь, потому что я использую только один элемент управления формы , чтобы показать оба выбора, нужно ли мне использовать FormArray здесь для генерации 1+ выбирает по ключам?

this.deleteForm = this.fb.group({
  organizationUser: [[], [Validators.required]],
});

// загрузка пользователей организации для шаблона , вызов API для получения информации

this.organizationUsers$ = this.userApi.getOrganizationUsers(this.userIds, this.organizationIds)
  .pipe(
    tap(result => console.log(result)),
      (error: string) => this.notification.error(error)
    )
  );

organizationUsers $ структура / отображение это не совсем идеально, потому что моя структура из API выглядит примерно так: Не уверен, как определить ту же структуру в Ts?

From API:
1: {
  Users: [],
  OrganizationId: 1(the key)
}

TS:
export interface OrganizationUsersResponse {
  OrganizationId: number;
  Users: IUserItem[];
}

export interface IUserItem {
  UserId: number;
  FullName: string;
}

мой шаблон

<div class="form-group" *ngFor="let item of (organizationUsers$ | async | keyvalue); let i = index">
  <select class="form-control" formControlName="organizationUser">
    <option *ngFor="let info of item.value.Users | keyvalue; let i = index" [value]="info.value.UserId">
      {{ info.value.FullName }}
    </option>
  </select>
</div>

Банкомат. Я не совсем уверен, как я могу получить по запросу [value] = "info.value.UserId" значений из всех выборок, используя только один элемент управления organizationUser.

Я пытался сделать что-то вроде этого:

this.deleteForm.value.organizationUser

но это будет только выборка последнего onIhange userId (значение). Нужно ли определять formArray для каждого из этих выборок? Или разные формы группы?

Example

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...