角度使用 ui-select2 将对象分配为模型属性答案

【问题标题】：angular using ui-select2 to assign an object as a model property角度使用 ui-select2 将对象分配为模型属性
【发布时间】：2013-09-24 15:45:58
【问题描述】：

假设示例来说明我在使用 angular-UI select2 时遇到的问题。假设我有一个屏幕，我想在其中编辑“游戏”模型。游戏，除其他外，有玩家。我希望能够通过 select2 下拉菜单设置播放器。这是一些示例代码： app.js

$scope.getGamePromise().then(function(results) {
    $scope.game = results;
    console.log(game.players); //prints [{name:'Joe',age: 15},{name:'Sally',age:16}]
});

$scope.players = [
    {
        name: 'Joe',
        age: 15
    },
    {
        name: 'Fred',
        age: 14
    },
    {
        name: 'Sally',
        age: 16
    },
    {
        name: 'Lucy',
        age: 13
    }
]

view.html

<select ngModel="game.players" ui-select2 multiple>
    <option ng-repeat="player in players" value="player">{{ player.name }}</option>
</select>

当我想保存这个“游戏”对象时，我将游戏对象发送到服务器。服务器期望 game.players 是一个对象数组。但是，发送的是一个字符串。我对角度比较熟悉，并且对 select2 完全陌生。如何让我的 select2 将 game.players 设置为对象数组而不是字符串？

【问题讨论】：

标签： jquery-select2 angular-ui angularjs-select2

【解决方案1】：

我猜你找到了另一种解决方案，或者你不再有问题了。不管怎样，我把它贴在这里：

使用

<input>

而不是

<select>

例子：

<input type="hidden" ui-select2="playersCfg" ng-model="players"/>

以下配置：

$scope.playersCfg = {
        multiple: true,
        allowClear: true,
        data: { results: Player.query(), text: 'name' },
        formatResult: function(item) {
            return "<div class='select2-user-result'>" + item.name + "</div>";
        },
        formatSelection: function(item) {
            return item.name;
        }
    };

Player.query()

是一个资源，它返回一个包含名称（name）和标识符（id）的玩家列表

希望对某人有所帮助！

【讨论】：