角度檢查的函數由於ngModel而被忽略

Question

我是Angular的新手。

我試圖創建一個與另一個表進行比較的復選框表，並將檢查它是否存在。

這個函數很好用，但是當我添加ngModel為了保存更改時，在第一次加載頁面時，選中的函數會以某種方式被忽略：

  <tbody>
        <tr *ngFor="let w of workout;let i = index">
          <td>
            <div class="col-md-6">
              <input
              type="checkbox"
              name="workout_{{i}}"
              [checked]="checkIfExisted(w)"
              [value]="w"
              [(ngModel)]="program.workouts[i]">

     </div>
   </td>
   <td>
     <div class="col-md-6">{{w.workoutName}}</div>
   </td>
 </tr>
 </tbody>

我的功能：

 checkIfExisted(w:WORKOUT){
    if(!this.program.workouts || this.program.workouts.length == 0){
      console.log('no workouts found');
      return false;
    }

    this.arr = this.program.workouts.map(workout => workout.workoutId);

    if(this.arr.includes(w.workoutId)) {
       console.log('return true');
        return true;
    }

程序對象：

import { WORKOUT } from './workout.model';
export class PROGRAM {
  programId:number = 0;
  programName:string = '';
  programTarget:string = '';
  programNote:string = '';
  numOfExercises:number;
  workouts: WORKOUT[];
}

另一個問題是，即時通訊保存時，在ngFrom中將其保存為：

網頁畫面

{programName: "a", programTarget: "", programNote: "", numOfExercises: 1, workout_0: false, …}
numOfExercises:1
programName:"a"
programNote:""
programTarget:""
workout_0:false
workout_1:true

而不是保存整個對象，而是保存： workout_0:false ， workout_1:true

Answer 1

可能是因為在DOM渲染時無法加載您的業務邏輯文件，請嘗試對加載的適當數據使用自調用功能。