Angular2의 사전 체크 표시 체크 박스

Question

RC7을 사용하고 있습니다. 일부 체크 박스를 미리 채우고 싶지만 나에게 맞는 답을 찾을 수 없습니다.

은 기본적으로 나는이

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

가지고 부트 스트랩의 끝 부분에 체크 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를 켭니다 ngModel 및 checked를 사용하는 것을 시도했다 . 클릭하면 올바른 값을 구성 요소의 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

아래보십시오 체크 박스의 상태를 업데이트합니다 다음

price[i] 

[(ngModel)]="price[i]에 초기 값을 할당

@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]" 

는