微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript-Knockout.js布尔选择列表选项

我正在尝试创建一个使用Knockout绑定的下拉列表.下拉列表只有两个选项,但是,我要求选项的值为true和false.

视图

@model WebApplication13.Models.Indexviewmodel

@{
    ViewBag.Title = "Index";
}
<select data-bind="options: userOptions, value: userStatus, event: { change: selectionChanged }"></select>

@section Script {
    <script src="~/Scripts/scripts.js"></script>
    <script>

        var options = {
            userStatus: @(Model.IsNewUser ? "true" : "false"),
        };

        var viewmodel = init(options);
        ko.applyBindings(viewmodel);

    </script>
}

Java脚本

function init(options) {

    var viewmodel = {
        userStatus: ko.observable(options.userStatus),
        userOptions: ko.observableArray(['New User', 'Old User'])
    };

    viewmodel.selectionChanged = function(event) {
        alert(viewmodel.userStatus());
    } 

    return viewmodel;
};

但是,当我选择“新用户”或“旧用户”时,“ userStatus”的值为“新用户”或“旧用户”,而不是true或false.不知道我在做什么错,任何帮助将不胜感激.

解决方法:

使用optionsText绑定确定< select>中显示的文本.应该.

<select data-bind="options: userOptions, optionsText: textForOption, value: userStatus, event: { change: selectionChanged }"></select>

var viewmodel = {
        userStatus: ko.observable(options.userStatus),
        userOptions: ko.observableArray(['true', 'false']),
        textForOption: function (option) {
            if (option === 'true') {
                return 'New User';
            } else {
                return 'Old User';
            }
        },
    };

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐