相关疑难解决方法(0)

使用模型编号的Angularjs ng-options不选择初始值

我正在尝试使用ng-options和a <select>将数字整数值绑定到相应选项的列表.在我的控制器中,我有这样的事情:

myApp.controller('MyCtrl', function() {
    var self = this;

    var unitOptionsFromServer = {
        2: "mA",
        3: "A",
        4: "mV",
        5: "V",
        6: "W",
        7: "kW"
    };

    self.unitsOptions = Object.keys(unitOptionsFromServer).map(function (key) {
        return { id: key, text: unitOptionsFromServer[key] };
    });

    self.selectedUnitOrdinal = 4; // Assume this value came from the server.
});
Run Code Online (Sandbox Code Playgroud)

HTML:

<div ng-controller="MyCtrl as ctrl">
    <div>selectedUnitOrdinal: {{ctrl.selectedUnitOrdinal}}</div>
    <select ng-model="ctrl.selectedUnitOrdinal" ng-options="unit.id as unit.text for unit in ctrl.unitsOptions"></select>
</div>
Run Code Online (Sandbox Code Playgroud)

这里有一个jsFiddle演示了这个问题,以及我采取的一些其他方法,但我并不满意.

正在使用空值初始化select选项,而不是在此示例中预期的"mV".如果您选择其他选项 - selectedUnitOrdinal正确更新,绑定似乎工作正常.

我注意到如果你将初始模型值设置为字符串而不是数字,那么初始选择就可以了(参见小提琴中的#3).

我真的希望ng-options能够很好地使用数字选项值.我怎样才能优雅地实现这一目标?

angularjs ng-options angularjs-ng-options

60
推荐指数
7
解决办法
6万
查看次数