更新:它现在支持现在的嵌套属性。 https://github.com/valor-software/ng2-bootstrap/issues/135
我在Angular 2中使用ng2-bootstrap。
我正在尝试使用Typeahead。
示例代码
private statesComplex:Array<any> = [
{id: 1, name: 'Alabama'}, {id: 2, name: 'Alaska'}, {id: 3, name: 'Arizona'}];
和
<input [(ngModel)]="selected"
[typeahead]="statesComplex"
(typeaheadOnSelect)="typeaheadOnSelect($event)"
[typeaheadOptionField]="'name'"
class="form-control">
运行良好。
但是当我尝试更改数据格式时
private statesComplex:Array<any> = [
{id: 1, profile: {name: 'Alabama', email: '111'}}, {id: 2, profile: {name: 'Alaska', email: '222'}}, {id: 3, profile: {name: 'Arizona', email: '333'}}];
并使用
<input [(ngModel)]="selected"
[typeahead]="statesComplex"
(typeaheadOnSelect)="typeaheadOnSelect($event)"
[typeaheadOptionField]="'profile.name'"
class="form-control">
它不起作用。我认为这个问题与typeaheadOptionField有关,但我不知道如何编写它。
由于
答案 0 :(得分:3)
看起来这种符号不会被识别为子对象的嵌套属性(参见source)。在这种情况下,您可以稍微预处理数据。也许通过实际引入这个辅助属性:
this.statesComplex.forEach(state => state['profile.name'] = state.profile.name);
它会向所有对象添加新的profile.name
属性,因此typeahead应该按预期工作。