Question

我有一个这样的对象

var myObject = {'123':'something','345':'something else'}

我需要将其渲染为：

<option value={'123':'something'}>something</option>

以下是我的尝试：

ng-options="someObj as label for (id,label) in myObject

不能工作！

该模型获得＆＃39;标签＆＃39;而不是整个对象。甚至可以将对象分配给SELECT元素的value属性吗？

修改

过滤表单对象：{＆＃39; 123＆＃39;：＆＃39;＆＃39; 345＆＃39;：＆＃39;其他＆＃39;}

.filter('putKeysandValues',function(){
        return function(options){
            var arr = [];
            angular.forEach(options,function(value,key){
                arr.push({'key':key,'label':value})
            });
            return arr;
        }
    });

Answer 1

您需要提供一个带钥匙和钥匙的物品。值属性为ngOptions。为此，您需要修改对象的结构以实际具有此属性。

一种方法是使用过滤器返回ngOptions的有效数组：

ng-options="option.label for option in data.availableOptions | putKeyAndValue"

您可以使用工作过滤器查看this plunker。

如果输入为：

[{'123':'something'}, {'345':'something else'}]

然后输出是：

[{"123":"something","id":123,"label":"something","$$hashKey":"object:3"},{"345":"something else","id":345,"label":"something else","$$hashKey":"object:4"}]

如果要删除过时的id属性，请使用this filter。

输入相同的输入后，它将返回：

[{"id":123,"label":"something","$$hashKey":"object:3"},{"id":345,"label":"something else","$$hashKey":"object:4"}]

如果仍需要返回一个新数组，则不要在过滤器上执行此操作。在这种情况下，您可以在将数据传递给视图之前处理数据，所有这些都在控制器like this中。

输入：

{'123':'something', '345':'something else'}

输出：

[{"id":123,"label":"something"},{"id":345,"label":"something else"}]

Answer 2

使用选择某些 a（键，值）值集

ng-options="key as value for (key,value) in myObject"

这会将键放入标签中的选项值和值。有了它，您还需要使用ng-model和ngChange。由于您无法将对象传递给值，因此想法是在控制器中执行此操作。

<select ng-model="val" ng-change="changeVal(val)" ng-options="key as value for (key,value) in ops">

在您的控制器中，您已经拥有myObject，您将添加所选项目和changeVal函数

<script>
    var selectedObject;
    $scope.changeVal = function(val){
        selectedObject = {};
        selectedObject[val] = myObject[val];
    }
</script>

这是一种解决方法，没有将对象放入值attr，因为它是一个字符串。

指定一个对象来选择值 - ng-options

2 个答案: