@Component({
  selector: 'my-app',
  template: `
    <input type="checkbox" (click)="getNight()">Night
    <input type="checkbox" (click)="getDay()">Day
    <input type="checkbox">Uncheck
    <br><br>
    <table>
      <tr *ngFor="let task of tasks">
        <td>{{task.chkBoxImageUrl}}</td>
        <td>{{task.id}}</td>
        <td>{{task.val}}</td>
      </tr>
    </table>
  `,
})
export class App {
  tasks: Array<{chkBoxImageUrl: string, id: string, val: string,
checked:boolean}> = [
    {chkBoxImageUrl: "http1", id: "item1", val: "Night", checked: false},
    {chkBoxImageUrl: "http2", id: "item2", val: "Day", checked: false},
    {chkBoxImageUrl: "http3", id: "item3", val: "Night", checked: false},
    {chkBoxImageUrl: "http4", id: "item4", val: "Day", checked: false},
    {chkBoxImageUrl: "http4", id: "item4", val: "Morning", checked: false},
    {chkBoxImageUrl: "http4", id: "item4", val: "Evening", checked: false}
  ];

  getNight() {
   console.log(this.tasks[2].val); // Night
   // return this.tasks.filter(obj => obj.checked).map(obj => obj.val);
   if(this.tasks.val == 'Night') {
    return this.tasks.filter(obj => obj.checked).map(obj => obj.val == 'Night');
   } else {
     console.log('666666');
   }
  };
  getDay() {
   return this.tasks.filter(obj => obj.checked).map(obj => obj.val);
  };
  getCheckedCount(){
    return this.getCheckedValues().length;
  }
}