angular2选择选项始终选择最后一个选项

时间:2017-05-21 09:13:32

标签: angular select option

我在angular2 select中选择了选项值。如果我单独运行程序,我可以选择正确的值,但是当我在项目中使用相同的代码时,它会给我不同的输出,即它总是选择所有3个选项中的最后一个选项。下面是代码剪切,你可以在plunker上运行。

如果您运行此代码,它将完美地工作,所以与我一样。 但是,当我在项目代码中合并此代码时,问题才出现。 请查看显示正确和错误行为的附加输出图像。

import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import {Observable} from 'rxjs/Rx';
import {FormsModule} from '@angular/forms';

@Component({
  selector: 'my-app', 
  template: `
      <select class="station browser-default"  
      *ngFor="let itemValue of cresele  let selectIndex=index" 
      [(ngModel)]="dat[selectIndex]"  name="dat[selectIndex]">

                <option *ngFor="let item of cresele" value="{{item.keyName}}"
      [disabled]="item.keyName && (dat[selectIndex] !=item.keyName) 
      && dat.indexOf(item.keyName) >= 0"  >
      {{item.keyName}} - {{dat[selectIndex] == item.keyName}}</option>

                </select>
                <br/><br/>
  `,
})
export class App {

  dat:any;
  cresele:any;


  constructor(){
   this.dat=[];
   this.dat[0]=1;
   this.dat[1]=2;

      this.cresele=[];


   this.cresele.push({keyName: 1});
   this.cresele.push({keyName: 2});
   this.cresele.push({keyName: 3});
  }


}

@NgModule({
  imports: [ BrowserModule,FormsModule ],
  declarations: [ App ],
  bootstrap: [ App ]
})
export class AppModule {}



I am struggling from some hours in this. Could anyone help ?

This is the wrong output, which I am getting on merging the above logic in my project

This is the correct output, which I am getting when running the program alone

0 个答案:

没有答案