[ ] Check all
------------------------------------------
[ ] This is email subject #1
[ ] This is email subject #2
[ ] ...

<form [formGroup]="form">
  <div><input formControlName="toggleAll" type="checkbox"></div>

  <div>
    <ul formArrayName="checkMailList">
      <li *ngFor="let mail of mails; let i=index">
        <input type="checkbox" [formControlName]="i">
        <div>mail.subject</div>
      </li>
    </ul>
  </div>
</form>

@Component({ ... })
export class MailListComponent implements OnChanges {
  @Input() mails: Mail[];

  private get checkMailList(): FormArray { return this.form.get('checkMailList') as FormArray; }

  constructor() {
    this.form = new FormGroup({
      checkMailList = new FormArray([]);
    });
  }

  ngOnChanges(changes: SimpleChanges) {
    if (!changes['mails'] || !changes['mails'].currentValue) {
      return;
    }

    // remove array first from form, as we will get mails again when anything updates
    if (this.checkMailList.length > 0) {
      this.form.removeControl('checkMailList');
      this.form.addControl('checkMailList', new FormArray([]));
    }

    this.mails.forEach(m => {
      this.checkMailList.push(new FormControl());
    });

    this.form
      .valueChanges
      .pluck('toggleAll')
      .distinctUntilChanged()
      .subscribe(selectAll => {
        if (selectAll) {
          this.checkMailList.setValue(this.mails.map(_ => true));
        } else {
          this.checkMailList.reset();
        }
      });
  }
}