javascript - KnockoutJS 不显示选择

Question

我正在尝试获取一个选择菜单来显示在外部脚本表中创建的列表中的选项。名单：

window.list = [
        {
            Name: 'Male',
            Value: 1,
            notApplicable: 'me'
        },
        {
            Name: 'Female',
            Value: 2,
            notApplicable: 'me'
        },
        {
            Name: 'Not Specified',
            Value: 3,
            notApplicable: 'me'
        }
        ];

的HTML：

<li>
  <label for="5">Sex</label>
  <select name="" id="5" data-bind="options: list, optionsText: 'Name', optionsValue: 'Value', optionsCaption: 'Choose',  value: user.SELECT"></select>
</li>

在浏览器中显示时，下拉菜单不显示标题和下拉选项。这是一个注册页面，用户将在其中选择他们的性别。

Answer 1

您是否在控制台中遇到错误？如果您的视图模型没有 user.SELECT 属性，则绑定将失败。我添加了一个 user.SELECT 属性，它似乎工作：http: //jsfiddle.net/BEeuQ/1/

html:

<select name="" id="5" data-bind="options: list, optionsText: 'Name', 
    optionsValue: 'Value', optionsCaption: 'Choose', 
    value: user.SELECT"></select>

js：

var vm = {
    list : [ { Name: 'Male', Value: 1, notApplicable: 'me' }, { Name: 'Female', Value: 2, notApplicable: 'me' }, { Name: 'Not Specified', Value: 3, notApplicable: 'me' } ],
    user:{
        SELECT:ko.observable()
    }
}

ko.applyBindings(vm)

此外，您可能不想将数据直接放在窗口对象上。全局变量在 Javascript 中很糟糕。创建一个命名空间（对象）并将所有内容放在那里。