NG-选择Angularjs 2

没有更新你好，我是在angularjs 2NG-选择Angularjs 2

新我可以formGroup在NG-选择控制研究添加和预定义的附加值。

这是完美的。但按钮点击后，新值推入ng选择但ng选择不更新。

这里我plunker

https://plnkr.co/edit/Hwfk1T2stkiRcLTxuFmz

//our root app component 
import {Component, OnInit, NgModule, ViewChild} from '@angular/core'; 
import {BrowserModule} from '@angular/platform-browser'; 
import {FormControl, FormGroup, ReactiveFormsModule} from '@angular/forms'; 
import {SelectModule} from 'ng-select'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
<h1>ng-select demo app</h1> 
<form style="padding:18px;max-width:800px;" 
    [formGroup]="form"> 

    <div style="margin:5px 0;font-weight:600;">Single select example</div> 
    <ng-select 
      [options]="options0" 
      [multiple]="false" 
      placeholder="Select one" 
     formControlName="selectSingle" 
    > 
    </ng-select> 

    <button (click)="pushValue()">Click</button> 



    <div>Events:</div> 
    <pre #preSingle>{{logSingleString}}</pre> 

</form>` 
}) 
export class App implements OnInit { 

    form: FormGroup; 

    multiple0: boolean = false; 
    options0: any[] = []; 
    selection: Array<string>; 

    @ViewChild('preSingle') preSingle; 

    logSingleString: string = ''; 

    constructor() { 
     this.options0.push({"label":'test',"value":'Test'}); 
     console.log("Object:::"+JSON.stringify(this.options0)); 
    } 

    ngOnInit() { 
     this.form = new FormGroup({}); 
     this.form.addControl('selectSingle', new FormControl('')); 
     console.log("Object:::"+JSON.stringify(this.options0)); 
    } 

    pushValue() 
    { 
     console.log("pushValue call."); 
     this.options0.push({"label":"test","value":"Test"}); 
     console.log("Object:::"+JSON.stringify(this.options0)); 
    } 
} 

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

错在哪里???

来源

2017-06-30 Hothi Jimit

在ng-select源代码的样子，我注意到

ngOnChanges(changes: any) { 
    if (changes.hasOwnProperty('options')) { 
    this.updateOptionsList(changes['options'].isFirstChange()); 
    }

所以为了更新选项列表中，你应该火ngOnChanges。它可以通过创建新的参考做options0

this.options0 = this.options0.concat({"label":"test","value":"Test"});

或

this.options0 = [...this.options0, {"label":"test","value":"Test"}];

Modified Plunker

来源

2017-06-30 05:09:42 yurzui

可以使用Array.slice()更新到数组实例为了让角检测的变化阵列。

this.options0 = this.options0.slice();

来源

2017-06-30 05:11:20 Pengyy

NG-选择Angularjs 2

回答

相关问题