如何使用angularjs中的ng-options将对象关联为模型

Question

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

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

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.color对象关联到scope.shirts.color对象,以便如果我更改颜色名称或颜色代码之类的内容,则相关color对象中的相应项shirts.colors也应自动更新.

从我所知道的ng-options和ng-model,我将不得不为颜色创建新的对象,并设置基于什么是在选择框中选择它的价值,但这些对象将独立的颜色对象,并改变颜色的对象将不会更新相应的衬衫里的物品.

提前感谢您的回复.

Answer 1

您可以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.