[英]Angular checked function is ignored because of ngModel
Im new to Angular. 我是Angular的新手。
Im trying to create a checkbox table which compared with another table and will checked it if it existed. 我试图创建一个与另一个表进行比较的复选框表,并将检查它是否存在。
This function works great, but when I'm adding ngModel
- in order to save the changes, the checked function somehow ignored when first loading the page: 这个函数很好用,但是当我添加
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>
My function: 我的功能:
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;
}
Program object: 程序对象:
import { WORKOUT } from './workout.model';
export class PROGRAM {
programId:number = 0;
programName:string = '';
programTarget:string = '';
programNote:string = '';
numOfExercises:number;
workouts: WORKOUT[];
}
Another issue is that when im saving, in the ngFrom it saves it like this: 另一个问题是,即时通讯保存时,在ngFrom中将其保存为:
{programName: "a", programTarget: "", programNote: "", numOfExercises: 1, workout_0: false, …}
numOfExercises:1
programName:"a"
programNote:""
programTarget:""
workout_0:false
workout_1:true
Instead of saving the whole object is saves: workout_0:false
, workout_1:true
而不是保存整个对象,而是保存:
workout_0:false
, workout_1:true
可能是因为在DOM渲染时无法加载您的业务逻辑文件,请尝试对加载的适当数据使用自调用功能。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.