Açısal 2 onay kutusu tümünü gözden geçir

Question

Proje isimlerini kontrol etmek için bir listeye sahibim. En altta, hepsini kontrol etmek veya işaretini kaldırmak için bir onay kutusu yerleştirmek istiyorum. Bir * ngFor döngüsüne sahip bir * ngIf (kontrol edildiyse) ihtiyacım olduğunu düşünüyorum (tümünü kontrol et) ama bu oldukça zor bir iş ... Bunun nasıl yapıldığını anlayamıyorum. (Checked) veya bir şey mi yoksa * ngIf = "(checked)" komutunu kullanıyorum ve sonra project.isChecked öğesini ayarlamak için * ngFor döngüsü kullanın. Bunun mantığına giremem.

<input type="checkbox" [ngFormControl]="allCtrl"/> 

allCtrl bileşenin yapıcı içerisinde başlatılır: Kullanıcı çekleri ya denetlememektedir zaman

<div id="drp-project-select"> 
     <div class="scroller" [hidden]="!showMenu"> 
      <div id="search-wrapper"> 
       <i class="fa fa-search fa-xs"></i> 
       <input [(ngModel)]="searchTerm" type="text" placeholder="Zoek op naam..." #search> 
      </div> 
      <ul> 
       <li *ngFor="#project of projectdata.LoginResponse?.ProjectVM | searchpipe:'Project':search.value"> 
        <label class="checkbox-label" > 
         <input type="checkbox" class="dropdown-checkbox" [(ngModel)]="project.isChecked" (change)="addProject(project)" > 
         <span>{{project.Project}}</span> 
        </label> 
       </li> 
      </ul> 
     </div> 
     <div class="bottom-data" [hidden]="!showMenu"> 
      <label><input type="checkbox" id="bottom-checkbox"></label> 
     </div> 
    </div> 

Answer 1

"Bütün işaretini/check" onay kutusunu bir denetimi kullanmak istiyorsunuz haberdar olmak için. Sonra bu denetimin valueChanges mülkiyet güncellemeleri haberdar olmak için karşı kayıt ve buna göre isChecked alanları güncelleme olabilir: "beklenmeyen belirteç"

constructor() { 
    this.allCtrl = new Control(); 
    this.allCtrl.valueChanges.subscribe(
    (val) => { 
     this.projectdata.LoginResponse.ProjectVM.forEach((project) => { 
     project.isChecked = val; 
     }); 
    }); 
}