Angular 从下拉列表中将选定选项绑定到类型脚本对象角度2

我有一个表单，用户可以在其中创建Todo。

ITodo

具有以下属性：

export interface ITodo {
    id: number;
    title: string;
    priority: ITodoPriority;
}
export interface ITodoPriority {
    id: number;
    name: string;
}

因此，创建Todo包括设置

title

-属性和从下拉列表中选择

优先级。表单如下所示：

<form (submit)="saveTodo()">
    <input type="text" [(ngModel)]="todo.title" />
    <br />
    <select (change)="setPriority($event.target.value)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" [innerHtml]="priority.name"></option>
    </select>
</form>

<select (ngModelChange)="setPriority($event)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" >{{priority.name}}</option>
</select>

问题出在函数
setPriority
中，特别是在我试图设置
this.todo.priority
的部分。参数
priority
的值可用，但我无法将其设置为
this.todo.priority
。
我所做的尝试以及有效的方法如下：

private setPriority(priority: any): void {
    let p: ITodoPriority = null;
    this.formModel.priorities.forEach(function (item) {
        if(priority == item) {
            p = item;
        }
    });
    this.todo.priority = p;
}

所以，这确实有效，但它看起来有点丑陋和低效。
正确的方法是什么？
试着这样做：

<form (submit)="saveTodo()">
    <input type="text" [(ngModel)]="todo.title" />
    <br />
    <select (change)="setPriority($event.target.value)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" [innerHtml]="priority.name"></option>
    </select>
</form>

<select (ngModelChange)="setPriority($event)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" >{{priority.name}}</option>
</select>

为什么不同时使用具有
优先级的双向绑定呢？另外，由于您使用的是表单，我很惊讶它没有在表单中使用
name
-属性而引发错误，但无论如何，请使用双向绑定，并且由于
priority
是一个对象，并且您要绑定整个对象，请使用
[ngValue]
。因此，您的选择将如下所示：

<form (submit)="saveTodo()">
    <input type="text" [(ngModel)]="todo.title" />
    <br />
    <select (change)="setPriority($event.target.value)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" [innerHtml]="priority.name"></option>
    </select>
</form>

<select (ngModelChange)="setPriority($event)">
        <option *ngFor="let priority of formModel.priorities" [value]="priority" >{{priority.name}}</option>
</select>


{{priority.name}

因此，这里不需要更改事件，因为您使用的是双向绑定：）