ng-tags-input с динамической моделью

как я могу использовать ng-tags-input внутри цикла ng-repeat, когда каждый элемент имеет разные теги? Как я могу динамически установить ng-модель?

    <div ng-controller="myController">
        <ul>
            <li ng-repeat="file in files">
                {{file}} <tags-input ng-model="tags"></tags-input>
            </li>
        </ul>
    </div>

    app.controller('myController', function ($scope) {
        $scope.tags =  ['tagA','tagB'];

        // $scope.tags['file1'] =  ['tagA','tagB'];
        // $scope.tags['file2'] =  ['tagC','tagD'];
    });

Заранее спасибо!


person SiKeiDev    schedule 18.06.2015    source источник
comment
как tags относится к files? вам нужен массив tags для каждой итерации ng-repeat. можешь сделать file.tags?   -  person Claies    schedule 18.06.2015
comment
Как насчет массива tags? Являются ли они статическими или вы хотите сохранить значения во время выполнения?   -  person Vineet    schedule 18.06.2015
comment
@Claies Большое спасибо! Да, file.tags отлично работает!   -  person SiKeiDev    schedule 18.06.2015


Ответы (2)


У меня такое же решение, как предложил Claies, но я попробовал сам. Пожалуйста, проверьте рабочий пример: http://plnkr.co/edit/bNQ6DrUlNWdEAi8fnvBr?p=preview

HTML

<ul>
  <li ng-repeat="file in files">
      {{file.name}}
      <tags-input ng-model="file.tags"></tags-input>
    </li>
</ul>

Контроллер

var app = angular.module('plunker', ['ngTagsInput']);

app.controller('MainCtrl', function($scope, $http) {
  $scope.files = [
    {
      name : 'file1','tags': [{text: 'tagA'},{text: 'tagB'}]  
    },
    {
      name : 'file2','tags': [{text: 'tagC'},{text: 'tagD'}]  
    }  
  ];
});
person User2    schedule 18.06.2015

Вы можете использовать ng-model для формирования более сложного выражения, такого как tags[file], предполагая, что file — это строка, соответствующая ключу в вашем словаре.

<div ng-controller="myController">
     <ul>
         <li ng-repeat="file in files">
             {{file}} <tags-input ng-model="tags[file]"></tags-input>
         </li>
     </ul>
</div>
$scope.tags = {
  'first': [{text: 'Tag1'}, {text: 'Tag2'}],
  'second': [{text: 'Tag3'}, {text: 'Tag4'}]
};
$scope.files = ['first', 'second'];

См. пример плунжера

person Yaelet    schedule 18.06.2015