Question

我正在尝试使用knockoutjs绑定一个checkboxlist。我有一个与配置文件列表相关的用户，我想要的是在加载页面时使用用户配置文件初始化复选框列表。

这是我的代码

var userProfileList = [];
var jsonUserAdminModel = null;
var viewModel = {
    ,firstName: ko.observable()
    ,lastName: ko.observable()
    ,userId: ko.observable()
    ,userProfiles: ko.observableArray(userProfileList)
    ,result: ko.observable()
};

viewModel.result = ko.computed(function () {
    jsonUserAdminModel = {
        UserId: (this.userId() != undefined ? this.userId() : null)
        ,FirstName: (this.firstName() != undefined ? this.firstName() : null)
        ,LastName: (this.lastName() != undefined ? this.lastName() : null)            
    }
    return jsonUserAdminModel;
}, viewModel);

$(document).ready(function () {               
        ko.applyBindings(viewModel);
        //Init the list of all profiles
        viewModel.userProfiles(@Html.Raw(Json.Encode(Model.Profiles)));
    });

HTML

<div id="UserProfiles" data-bind="foreach: userProfiles" style="margin: 10px">
    <input type="checkbox" data-bind="value: ProfileId" /><span data-bind="text: Name"></span>
</div>

我想检查用户默认配置文件并绑定它。

感谢。

Answer 1

您可能希望将输入绑定到用户个人资料对象上的checked observable。为此，您需要创建一个配置文件视图模型，并将原始数据转换为该视图模型的实例，以便可以使其属性可观察。您也可以使用ko.mapping插件来实现此目的。

然后你的HTML看起来像这样：

<div id="UserProfiles" data-bind="foreach: userProfiles" style="margin: 10px">
    <input type="checkbox" data-bind="attr: {value: ProfileId() }, checked: isChecked" /><span data-bind="text: Name"></span>
</div>

使用knockoutjs绑定一个checkboxlist

1 个答案: