Angular2中的預勾號複選框

Question

我正在使用RC7。我想預先填充一些複選框，但無法找到適合我的答案。

基本上我有這個

ngOnInit() { 
    this.price = [true, true, false]; 
    } 

，並嘗試使用ngModel和checked接通3個複選框

<label *ngFor="let val of prices; let i = index" class="radio-inline"> 
    {{val.name}} 
    <input type="checkbox" [(ngModel)]="price[i]" [checked]="price[i]" name="price"> 
</label> 

但沒有複選框的2在引導結束時檢查。如果我點擊它們，那麼在組件中的this.price中有正確的值。

更新：同樣

<input type="checkbox" [(ngModel)]="price[i]" [value]="price[i]" name="price"> 

不起作用。

回答 我得到了最好的結果，兩個答案結合下面，通過使用ngModel但與存儲在迭代布爾值。

<label *ngFor="let val of prices" class="radio-inline"> 
    {{val.name}} 
    <input type="checkbox" [(ngModel)]="val.state" name="price" /> 
</label> 

Answer 1

下面嘗試的狀態下，

@Component({ 
    selector: 'my-app', 
    template: `<h1>My First Angular 2 App</h1> 
    <label *ngFor="let val of prices; let i = index" class="radio-inline"> 
    {{val.name}} 
    <input type="checkbox" [checked]="val" name="price"> 
</label> 
    ` 
}) 
export class AppComponent { 
    prices=[]; 
    ngOnInit() { 
    this.prices = [true, true, false]; 
    } 
} 

這是Plunker!!

希望這有助於！

Answer 2

代替

[checked]="price[i]" 

初始值分配給

price[i] 

然後[(ngModel)]="price[i]將更新的複選框