2015-06-18 2 views
0

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

<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']; 
    }); 

Заранее благодарен!

+0

как в 'tags' относятся к' files'? вам нужен массив 'tags' для каждой итерации' ng-repeat'. вы можете сделать 'file.tags'? – Claies

+0

Как насчет массива 'tags'? Являются ли эти статические или вы хотите хранить значения из времени выполнения? – Vineet

+0

@ Claies Большое спасибо! Да, file.tags работает отлично! – SiKeiDev

ответ

0

У меня есть такое же решение, как предложил 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'}] 
    } 
    ]; 
}); 
0

Вы можете использовать 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']; 

See plunker example

Смежные вопросы