Почему это угловое связывание не работает?

Question

У меня есть следующий HTML

<input type="checkbox" name="person" [(ngModel)]="person.selected" /> 

Это показано на ngFor петли. Я вывожу значение selected для тестирования, а некоторые - true, а некоторые другие - false, несмотря на это, отмечены флажки ALL.

Есть ли что-то не так в синтаксисе привязки?

Answer 1

Проблема была в том, что я использовал то же самое name на всех флажках. Использование уникальных имен сделал трюк

Answer 2

Я не вижу никаких проблем, используя привязку, убедитесь, что selected правдивый или фальшивый.

@Component({ 
    selector: 'my-app', 
    template: ` 
    <h1 class="title">Simple component</h1> 
     <div *ngFor="let person of persons" > 
     {{person.name}} 
     <input type="checkbox" name="person" [(ngModel)]="person.selected" /> 
     </div> 
    ` 
    }) 
    export class AppComponent { 

    persons = [ 
    { 
     name: "first", 
     selected: true 
    }, 
    { 
     name: "second", 
     selected: false 
    }, 
    { 
     name: "third", 
     selected: false 
    }, 
    { 
     name: "fourtch", 
     selected: true 
    } 
    ] 
    } 

Вот Plunker!

Надеется, что это помогает !!