Angular-ui select2 tagging -预选标签id/text

angular-ui select2 tagging - preselected tags id/text

本文关键字：标签 id text select2 tagging Angular-ui      更新时间：2023-09-26

这是我的标签输入

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

现在我怎么做，比如标签id为5，预选加载?

如果我输入$scope。标签= [5];甚至$scope。Tags = 5它创建了一个新的标签，id为5，文本为5(虽然它从选项中删除)..我显然希望它说"tag1"，而不是5，但仍然保持模型中的ID .

您演示的内容:

<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>

Angular-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 =

预览

为什么它会起作用?我不确定。也许有一个类型或其他东西没有正确加载。我从未使用过Angular或Select2，所以我花了几次尝试才让它工作。

嗯。那么，将代码原样复制到plunk中，没有其他更改，我得到:

http://embed.plnkr.co/wUQq8P

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

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

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

Angular-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 =预览

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

相关文章：