Question

我有一个列表listSiteTriage。我想绑定到控制器选择的值。

  <select [(ngModel)]="selectedSite" (ngModelChange)="onChange()">
                  <option *ngFor="let site of listSiteTriage" >{{site.Intitule}}</option>
                </select>

控制器：

import { Component, OnInit, OnChanges, NgModule} from '@angular/core';

@Component({
 selector: 'xxx',
 templateUrl: './xxx.component.html',
 styleUrls: ['./xxx.component.scss']
 })
 export class Travaux implements OnInit , OnChanges {

 listSiteTriage: any[];
 site: any;


 } 
  onChange(){
  console.log(this.selectedSite);
  }
 }

Answer 1

删除[ngValue]

<select [(ngModel)]="site" (ngModelChange)="onChange()">
         <option *ngFor="let site of listSiteTriage" >{{site.Intitule}}</option>
  </select>

Answer 2

您是iterator且ngModel个变量都被命名为site，将其重命名为不同（例如selectedSite）

<select [(ngModel)]="selectedSite" (ngModelChange)="onChange()">
      <option *ngFor="let site of listSiteTriage" [ngValue]="site.Id">{{site.Intitule}}</option>
</select>

import { Component, OnInit, OnChanges, NgModule} from '@angular/core';

@Component({
 selector: 'xxx',
 templateUrl: './xxx.component.html',
 styleUrls: ['./xxx.component.scss']
 })
 export class Travaux implements OnInit , OnChanges {

listSiteTriage: any[];
selectedSite: any = 1;

onChange(){
      console.log(this.site);
  }
}

如何从Angular Select中的* ngFor项绑定对象id？此时，select绑定与插值相同的值。

2 个答案: