0

Ich habe eine Eltern-Direktive mit einem Controller, der eine Methode auf $ scope setzt.AngularJS - Binden einer Funktion an einen isolieren Bereich über '&', nicht feuern an NG-Klick

Dann, in der Child-Direktive, versuche ich, diese Scope-Methode über &.

Die ng-click innerhalb der Child-Direktive wird jedoch nicht mit der übergeordneten Bereichsfunktion ausgelöst. Mache ich das falsch?

Geordnete Richtlinie (wo Methode definiert ist)

app.directive('ParentDirective', [ 
    '$http', 
    function($http) { 
     return { 
      restrict: 'AE', 
      template: '' + 
       '<div child-directive ' + 
        'list="list" ' + 
       '/>' + 
      '', 
      controller: function ($scope, $http) { 

       $scope.setSelected = function (selector) { 
        console.log('hit!', selector); 
       } 

       $scope.list = []; 

      }, 
      link: function postLink(scope, element, attrs) {} 
     }; 
    } 
]); 

Child-Richtlinie (versuchen Mutter Methode aufrufen ng Klick, aber nicht funktioniert)

app.directive('childDirective', [ 

     '$window', 
     function($window) { 
      return { 
       restrict: 'AE', 
       scope: { 
        setSelected: '&', 
        list: '=', 
       }, 
       template: '' + 
        '<ul>' + 
         '<li ng-repeat="person in list" ng-click="setSelected(person)">{{person.uri}}</li>' + 
        '</ul>' + 
       '', 
       link: function postLink(scope, element, attrs) { 
       } 
      }; 
     } 
    ]); 

Bin vorbei I $scope.setSelected() falsch von der Eltern zu der Kind-Direktive?

EDIT: Also änderte es die übergeordnete Vorlage die Funktion wie so zuweisen: Vorlage: '' + '' + '',

dies wird nun die Funktion auslösen, aber das Argument tut nicht von der Child-Direktive übernommen. Wie kann ich die Child-Direktive dazu bringen, ein Argument in die Funktion der Eltern-Direktive zu übergeben?

Antwort

1

ParentDirective hat Tippfehler sein sollte: parentDirective

in der parentDirective Vorlage sollten Sie die Funktion 'list = "list"' Pass + 'Set-selected = "setSelected (Person)"'

try this :

html:

<parent-directive ></parent-directive> 

js:

app.directive('parentDirective', [ 
    '$http', 
    function($http) { 
     return { 
      restrict: 'AE', 
      template: '' + 
       '<div child-directive ' + 
        'list="list" ' + 'set-selected="setSelected(person)"'+ 
       '/>' + 
      '', 
      controller: function ($scope, $http) { 

       $scope.setSelected = function (selector) { 
        console.log('hit!', selector); 
       } 

       $scope.list = []; 

      }, 
      link: function postLink(scope, element, attrs) {} 
     }; 
    } 
]) 
    app.directive('childDirective', [ 

     '$window', 
     function($window) { 
      return { 
       restrict: 'AE', 
       scope: { 
        setSelected: '&', 
        list: '=', 
       }, 
       template: '' + 
        '<ul>' + 
         '<li ng-repeat="person in list" ng-click="setSelected({person:person})">{{person.uri}}</li>' + 
        '</ul>' + 
       '', 
       link: function postLink(scope, element, attrs) { 

       } 
      }; 
     } 
    ]); 

Arbeits Plunker:

https://plnkr.co/edit/KUWZ9bYbhnbumFwIgcIX?p=preview

+0

Argument ist für mich noch nicht definiert, aber ich weiß, dass es Daten in der ng-Repeat ist, weil ich die '{{person.uri}}' sehen ... aber Wenn ich versuche, Selektor in '$ scope.setSelected()' auszuloggen, ist es undefiniert. – Prefix

+0

@Prefix ich beigefügt arbeiten plump – avim101

+0

ahh ich war mit einem anderen Argument Name in 'set-selected =" setSelected (person) 'so war es undefiniert. Als ich es in' person' geändert hat es funktioniert. Danke! – Prefix

Verwandte Themen