Question

这是我的标签输入

<input type="hidden" ng-model="tags" class="input-large" ui-select2="{ tags: [{ id:5, text: 'tag1' }, { id: 8, text: 'tag2' }] }" />

现在如何制作，例如ID为5的标签，在加载时预先选择？

如果我做$ scope.tags = [5];甚至$ scope.tags = 5它创建一个id为5和text 5的新标签（尽管它从选项中删除）..我显然希望它说“tag1”，而不是5，但仍然在模型中维护ID。

Answer 1

你所展示的内容：

<强> HTML

<p>
  <input type="text" ng-model="tags" 
         ui-select2="{tags: [{id:4, text:'red'},{id:2, text:'blue'},{id:8, text:'white'},{id:41, text:'green'},{id:13, text:'yellow'}]}" />
</p>

<强>角-UI

angular.module('app').controller('MainCtrl', function($scope) {
  $scope.message = "Will load shortly...";

  $scope.tags = [8, 2];

  $scope.message = 'Loaded';
});

http://plnkr.co/edit/wUQq8P?p=preview

为什么它会起作用呢？我不确定。也许有一种类型或某些东西没有正确加载。我从来没有使用过Angular或Select2，所以我花了几次尝试才能让它工作。

嗯。好吧，按原样将代码复制到插件中，没有其他更改，我得到：

http://embed.plnkr.co/wUQq8P

所以我猜这个问题我要么不理解，要么就是你代码中的其他地方。

这是最初的工作示例，使用的方法很容易与AJAX配对：

<强> HTML

<body ng-controller="MainCtrl">
  <h4>{{message}}</h4>
  <p>
    <input type="text" ui-select2="options" ng-model="tags" />
  </p>
</body>

<强>角-UI

angular.module('app').controller('MainCtrl', function($scope) {
  $scope.message = "Will load shortly...";

  $scope.options = {
    tags: [
      {id:4, text:'red'},
      {id:2, text:'blue'},
      {id:8, text:'white'},
      {id:41, text:'green'},
      {id:13, text:'yellow'}
    ]
  };

  $scope.tags = [8, 2];

  $scope.message = 'Loaded';
});

http://plnkr.co/edit/wUQq8P?p=preview

Answer 2

所以问题实际上是使用了select2的版本。我使用的是3.3.1，它不起作用，请参阅http://plnkr.co/edit/Z53wvGKT1if1iZAVierY?p=preview

当我使用3.3.2时，它按预期工作。

angular-ui select2标记 - 预选标记id / text

2 个答案: