ngSemantic select 不绑定到对象

Question

我正在使用 Angular2 和 ngSemantic 库。我创建了一个表单，这是我的代码：

模板文件：

<div class="container">
    <h1>My first form</h1>
    <form class="ui form" [formGroup]="myForm">
        <sm-loader [complete]="!submitted" class="inverted" text="Loading..."></sm-loader>

        <div class="field">
            <sm-select [(model)]="firstSelect" [control]="myForm.controls.category" placeholder="Search..." class="fluid search">
                <option *ngFor="let item of itemslist" [value]="item">{{item.name}}</option>
            </sm-select>
        </div>

        <div class="field">
            <sm-select placeholder="Search..." class="fluid search">
                <option *ngFor="let i of firstSelect?.items">{{i}}</option>
            </sm-select>
        </div>

        <sm-button (click)="onSubmit()" [disabled]="!myForm.valid" class="primary">Login</sm-button>
    </form>
</div>

组件文件：

itemslist: any = [
    { name: 'first', items: ['one', 'two', 'three']},
    { name: 'second', items: ['one', 'two', 'three']},
    { name: 'third', items: ['one', 'two', 'three']}
];

constructor(private dataService: DataService, fb: FormBuilder) {
    this.myForm = fb.group({
        'category': [],
        'subcategory': [],
        'name': [],
        'email': []
    });
}

第二个选择中的循环不起作用，因为firstSelect 结果是字符串而不是Object。可能发生这种情况是因为 select/option 只处理 string 或 number。

我该如何解决这个问题？

Answer 1

{{...}} 进行字符串插值。如果要传递对象实例，请不要使用它。

改为使用对象绑定

[value]="item"