Select показывает объект для выбранного значения с помощью Angular 2
У меня есть компонент выбора, который отлично загружает значения, но независимо от того, что я поставил в качестве значения, он всегда возвращается как объект. Я пробовал следующее
<select [(ngModel)] = "p.selectedUser">
<option *ngFor = "let u of p.practiceUsers;let i of index;" [value] = "i">{{ u.userName }}</option>
</select>
<select [(ngModel)] = "p.selectedUser">
<option *ngFor = "let u of p.practiceUsers;let i of index;" [value] = "u">{{ u.userName }}</option>
</select>
<select [(ngModel)] = "p.selectedUser">
<option *ngFor = "let u of p.practiceUsers;let i of index;" value = "{{i}}">{{ u.userName }}</option>
</select>
Если на странице ниже выберите, я поставил {{ p.selectedUser | json}}, он показывает [object object]
У меня есть такие варианты выбора во всем приложении, поэтому я не уверен, что мне здесь не хватает. Значение p.selectedUser по умолчанию поступает с сервера и представляет собой пустую строку.
Объект PracticeUser выглядит примерно так: { userId: 1, userName: "Joe Smith" }.
Вы пробовали регистрировать {{ p.selectedUser.value | json }}?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Второй подход должен быть хорош. Вы уверены, что у вас правильные данные в p?
Это имеет смысл, если [value] = "u" и u - это пользовательский объект, а его свойство u.userName - это метка.
Это действительно комментарий, а не ответ. С немного большим количеством повторений, вы сможете оставлять комментарии. Я отмечаю этот пост для удаления.
@Jimenemex только потому, что IMHO сообщение на самом деле не пытается ответить на вопрос. Кстати, какой из них второй?
Ну, мне так и не удалось распознать значение u, но я заставил его использовать индекс в качестве значения, изменив это:
<select [(ngModel)] = "p.selectedUser">
<option *ngFor = "let u of p.practiceUsers;let i = index;" [value] = "i">{{ u.userName }}</option>
</select>
У меня вместо а =
Если вы выполняете
*ngFor = "let u of p.practiceUsers, а объектpracticeUser- это{ userId: 1, userName: "Joe Smith" }... вы делаете*ngForв объекте?