angular - 在 angular2 中获取自定义 html 属性值

我正在使用 Angular 2 来构建我的应用程序。到目前为止，这是我的代码:

模板

<select class="form-control input-xs" [(ngModel)]="filter.coordinatorId" name="coordinatorId" (ngModelChange)="onCoordinatorChange($event)">
    <option *ngFor="let coordinator of coordinators; let i = index" [value]="coordinator.id" [selected]="i==0">{{coordinator.name}}</option>
</select>

组件

onCoordinatorChange(coordinatorId: number){
        alert(coordinatorId);
        //business logic
    }

如您所见，我在 [value]="coordinator.id" 中设置了 option，因此我在警报中获得了 coordinator.id 值，如果我将其更改为 coordinator.name，那么我将获得该值。但在这里我想获得多个值，如 coordinator.id 、 coordinator.name 、 coordinator.department 等。所以一种解决方案可能是使用逗号分隔，但如果其他参数出现，这将是丑陋且难以维护的。我是否还有其他选择来编写我的函数，例如:

onCoordinatorChange(coordinatorId: number, name: string, department: string){
            alert(coordinatorId);
            //business logic
}

最佳答案

使用 [ngValue] 而不是 [value] 并将整个对象设置为一个值，这样您将传递整个对象并且您将可以访问其所有属性:

<select class="form-control input-xs" [(ngModel)]="filter.coordinator" name="coordinatorId" (ngModelChange)="onCoordinatorChange($event)">
    <option *ngFor="let coordinator of coordinators; let i = index" [ngValue]="coordinator" [selected]="i==0">{{coordinator.name}}</option>
</select>

关于angular - 在 angular2 中获取自定义 html 属性值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40505948/