I have a list of students and their courses opted.NOw i need to create a checkbox of those subjects and after clicking a particular subject the list of students who have opted that particular subjects should be displayed.Need to do this just by using FILTER no formControl or any other method. IN HTMl
<div class="container">
<div class="row">
<div class="col-4" (change)="(show(crse))">
<input type="checkbox" [(ngModel)]="and">
<label>Android</label><br>
<input type="checkbox" [(ngModel)]="ang">
<label>Angular</label><br>
<input type="checkbox" [(ngModel)]="java">
<label>Java</label><br>
<input type="checkbox" [(ngModel)]="ALL">
<label>All</label><br>
</div>
<div class="col-8">
<div class="row">
<div class="col-6 bg-dark text-light">Name</div>
<div class="col-6 bg-dark text-light">Course</div>
</div>
<div class="row" *ngFor="let st of showStudents">
<div class="col-6 border"></div>
<div class="col-6 border"></div>
</div></div></div></div>
in .Ts
allStudents : Student[]=[
{name:'James',course:'Angular'},
{name:'Kary',course:'Android'},
{name:'Bob',course:'Java'},
{name:'Pam',course:'Java'},
{name:'Steve',course:'Angular'},
{name:'Williams',course:'Android'},
{name:'Julis',course:'Angular'},
{name:'Matt',course:'Java'},
{name:'Willy',course:'Android'},
];
showStudents:Student[]=[];
showCourses:string[];
crse:string='';
ang:boolean=false;
and:boolean=false;
java:boolean=false;
ALL:boolean=false;
s:string='Angular';
show(crse) {
if(this.ALL===true){
this.showStudents=this.allStudents;
this.showStudents;
}
else if(this.ang===true){
this.allStudents.course==this.s;
this.showStudents=this.allStudents;
}}
there might be some useless variables also which i might have created while i was trying different methods.
Please help!!
https://stackblitz.com/edit/angulaar-aman?file=src%2Fapp%2Fapp.component.ts this is the entire work.
Aucun commentaire:
Enregistrer un commentaire