Iquery
Iquery

Reputation: 103

ng-repeat data binding with custom directive

I have a list and on each item in list I am calling a modal window (custom directive) which should have details about that item being clicked , but the data does not change and remains same across each item. Please find the code below.

 angular
.module('Testapp')
.directive('testDirective', function () {
    return {
        restrict: "AE",
        templateUrl: "/Apps/templates/mytem/testdir.html",
        translucent: true,
        scope: {item:'=data'},
        link: function (scope, element, attribute) {
            console.log(scope.sequence);
        }
    };
});

Directive

 <div class="modal fade" id="modalAddFilters">
   <div class="modal-dialog">
   <div class="modal-content">
   <div class="modal-body tree"> 
  {{item}} 
   </div>
    </div>
    </div>
 </div>

Calling Template

<div>
<div ng-repeat="items in TestList>
<test-Directive   id="directive_modalAddFilters"  data="items"></test-Directive>
</div>

I am able to see the data correctly loaded in DOM but directive template doesnt change the data.

Upvotes: 2

Views: 910

Answers (1)

svarog
svarog

Reputation: 9839

You code works fine, except that you forget to close you ng-repeat with a quotation mark.

I think you just didn't properly resolved you data into the modal view.

I have made a plunk based on your (partial) code, I added a modal and everything works fine. I've used ui-bootstrap to show the modal with the repeated data injected.

Upvotes: 1

Related Questions