3

假设我有两个对象:颜色和衬衫。

每件衬衫都可以有多个属性以及多种颜色,这基本上是一组颜色对象。

function MyCntrl($scope) {
    $scope.colors = [
        {
            label:"Red",
            value:"r-e-d",
            available:true
        },
        {
            label:"Blue",
            value:"b-l-u-e",
            available:false
        }   
    ];

    $scope.shirts=[{
        size:"M",
        cost:100,
        colors:[ ]
    }
    ]
}

我如何使用ng-options向/从附加/删除color对象shirts.color

我想将对象关联scope.colorscope.shirts.color对象,以便如果我更改颜色名称或颜色代码等内容,则关联color对象中的相应项目shirts.colors也应该自动更新。

据我所知ng-optionsng-model我将不得不为颜色创建新对象并根据选择框中选择的内容设置其值,但这些对象将独立于颜色对象并且更改颜色对象不会更新相应的颜色对象衬衫中的物品。

预先感谢您的回复。

4

1 回答 1

6

您可以ng-options直接使用:

Color: <select multiple ng:model="shirt.colors" ng:options="c.value as c.label for c in colors"></select>

这是一个 Plunker:http ://plnkr.co/edit/FQQxrSE89iY1BnfumK0A?p=preview

更新

关于源代码的编辑colors:如果在衬衫的颜色中只存储值,则很难检测到更改了哪些项目并在选项中重新选择它(更改的选定项目取消选择,因为 AngularJS 不知道更改的原因)。

作为解决方法,您可以选择对象,而不是值。我已经更新了 plunker。

于 2013-02-07T14:36:05.597 回答