Question

我有一个使用primeng复选框的组件：

  List.findOneAndUpdate(
    { "_id": listid, "merch.details._id": merchid },
    { $set: { "merch.details.$.listcode": "ADS-100B" }},

当我这样做时，页面中断了，似乎永远循环调用<div *ngFor="let user of users"> <p-checkbox [name]="'0' + user.id" [value]="'User:' + user.id" [ngModel]="getUserModel()" (ngModelChange)="change($event)"> </p-checkbox> <p-checkbox [name]="'0' + user.id" [value]="'Admin:' + user.id" [ngModel]="getUserModel()" (ngModelChange)="change($event)"> </p-checkbox> </div> getUserModel() { var model = []; this.users.forEach(u => { if(u.category === 'Admin') model.push('Admin:' + u.id); else model.push('User:' + u.id); }; return model; }方法。如何动态分配模型？

Answer 1

我不知道为什么您的站点会中断，但是Angular经常访问ngModel中的值，因此通常来说，绑定函数不是一个好主意。相反，最好只建立一次值，然后将ngModel绑定到变量。 Angular跟踪该变量的变化，因此，如果您更改它，Angular也会这样做。

在这种情况下，您可以向Users模型添加一个附加字段，以保存getUserModel（）的结果，然后按以下方式访问它：

<div *ngFor="let user of users">
    <p-checkbox 
        [name]="'0' + user.id"
        [value]="'User:' + user.id" 
        [ngModel]="user.resOfGetUserModel"                                        
        (ngModelChange)="change($event)">
    </p-checkbox>

    // ... code omitted
</div>

在ts中，对您的用户执行for循环，然后对Users的每个条目执行getUserModel（）并将其保存到“ resOfGetUserModel”。

如果用户是getUserModel的结果，那么显然您可以直接输入，例如：[ngModel]="users"

如何动态绑定ngmodel？

1 个答案: