2016-01-19 22 views
5

içinde geçirme İşlenen her öğenin iç içe bir yönergesini (dalları oluşturan) içeren bir yönerge ağacına sahibim. Her iki yönerge kapsamında, üst denetleyiciyle konuşması gereken iki parametre bildirdim.Bir nesneyi, yalıtılmış kapsamı olan iç içe yönerge ile açısal

// iç içe aktarılan yönerge (dal) içindeki yöntem filtresini denetleyiciye bağlanan html yönergesine bağlı olan ağaç yönergesi özniteliğinde doSomething() yöntemine bağlar. Kapsamlı nesneyi denetleyiciye iletmesi gereken iki yönlü bağdaştırıcı paramterdir.

. (Ama şu anda değil)

Yönergesi:

app.directive('tree', function() { 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: { 
      t: '=src', 
      filter: '&', 
      iobj: '=' 
     }, 
     controller: 'treeController', 
     template: '<ul><branch ng-repeat="c in t.children" iobj="object" src="c" filter="doSomething()"></branch></ul>' 
    }; 
}); 

app.directive('branch', function($compile) { 

    return { 
     restrict: 'E', 
     replace: true, 
     scope: { 
      b: '=src', 
      filter: '&', 
      iobj: '=' 
     }, 

     template: '<li><input type="checkbox" ng-click="innerCall()" ng-hide="visible" /><a>{{ b.name }}</a></li>', 
     link: function (scope, element, attrs) { 
      var has_children = angular.isArray(scope.b.children); 
      scope.visible = has_children; 
      if (has_children) { 
       element.append('<tree src="b"></tree>'); 
       $compile(element.contents())(scope); 
      } 
      element.on('click', function(event) { 
       event.stopPropagation(); 
       if (has_children) { 
        element.toggleClass('collapsed'); 
       } 
      }); 
      scope.innerCall = function() { 
       scope.iobj = scope.b; 

       console.log(scope.iobj); 
       scope.filter(); 
      } 
     } 
    }; 
}); 

HTML:

<div ng-controller="treeController"> 
    <tree src="myList" iobj="object" filter="doSomething()"></tree> 

    <a ng-click="clicked()"> link</a> 
</div> 

Denetleyici:

app.controller("treeController", ['$scope', function($scope) { 
    var vm = this; 

    $scope.object = {}; 
    $scope.doSomething = function() { 
     var item = $scope.object; 
     //alert('call from directive'); 
     console.log(item); 
    } 

    $scope.clicked = function() { 
     alert('clicked'); 
    } 
... 

Şu anda yönergesi gelen işlevi $scope.doSomething çağırabilirsiniz kontrolöre. Bu yüzden kontrolör kapsamına direktiften ulaşabileceğimi biliyorum. Anlayamadığım şey, bir nesneyi direktiften kontrol ünitesine bir parametre olarak nasıl geçeceğidir. Bu kodu çalıştırdığımda, $scope.object her zaman boş bir nesnedir.

Bu konuyla ilgili herhangi bir yardım veya öneriniz için teşekkür ederiz.

cevap

2

& yönerge bağlaması, parametre geçirmeyi destekler. yönergesine bağlı ifadesinde sizin örneğe göre

scope.filter({message: 'Hello', anotherMessage: 'Good'}) 

message ve anotherMessage haline yerel değişkenler:

<tree src="myList" iobj="object" filter="doSomething(anotherMessage, message)"></tree> 

Burada geri arama parametreleri bir şablon içine ayarlanır örnek plunker bu.

Genellikle ana kapsamına bir ekspresyonu yoluyla izole kapsamından veri aktarmak için, bu yerel değişken isimleri ve değerlerin bir ilk geçirilmesiyle yapılabilir arzu edilir:

documentation açıkça belirtmektedir ifade sargısına fn. örneğinde, ifade increment(amount) ise, localFn'u localFn({amount: 22}) olarak arayarak miktar değerini belirtebiliriz.

İlgili konular