用Knockout绑定到两个对象的复选框

Checkboxes binding to two objects with Knockout

本文关键字：两个 对象 复选框 Knockout 绑定      更新时间：2023-09-26

我正在创建一个复选框列表。列表是由这个对象创建的:

this.definedRoles = ko.observableArray([]);

但是另一个对象有哪些框应该被选中。

this.userToAdd = {
        ID: ko.observable(""),
        FirstName: ko.observable(""),
        LastName: ko.observable(""),
        Active: ko.observable(""),
        Email: ko.observable(""),
        Roles: ko.observableArray([])//these are the values of the checkboxes
    };

我能够生成复选框使用:

<ul data-bind="foreach: $root.definedRoles" style="list-style:none;">
     <li>
         <label class="checkbox">
              <input type="checkbox" data-bind="value: Id" value="" />
              <span data-bind="text: Name"></span>
         </label>
     </li>
</ul>

每次我尝试使用

添加绑定以选中某些框时
<input type="checkbox" data-bind="value: Id, checked: $root.userToAdd.Roles.Active" value="" />

没有结果。不确定如何应用此绑定。由于

您可以做的是添加一个函数来检查给定的用户是否拥有该角色，如下所示:

var User = function() {
    var self = this;
    self.ID = ko.observable(""),
    self.FirstName = ko.observable(""),
    self.LastName = ko.observable(""),
    self.Active = ko.observable(""),
    self.Email = ko.observable(""),
    self.Roles = ko.observableArray([])//these are the values of the checkboxes,
    self.IsRoleActive = function(role) {
        for(i=0; i<self.Roles().length; i++) { 
            if(self.Roles()[i] == role && self.Roles()[i].Active) {
                return true;
            }
        }
        return false;
    }
};
var userToAdd = new User();
然后你的绑定应该是这样的: 
<input type="checkbox" 
       data-bind="value: Id, checked: $root.userToAdd.IsRoleActive"/>

当然，只有当Roles和definedRoles都是字符串数组时，这一切才有效。

因为Roles是一个可观察对象，你没有正确调用它:

$root.userToAdd.Roles().Active

虽然它是一个数组，那么.Active不会解析到任何东西，我想。

它只是一个字符串数组，详细说明了用户的角色吗?如果是，那么您需要执行以下操作:

$root.userToAdd.Roles.indexOf(Name()) !== -1

查看数组是否包含角色的字符串

相关文章：