Angularjs指令，指令 - 控制器 - 服務交互

標題有點拗口，但有我目前的狀況：Angularjs指令，指令 - 控制器 - 服務交互

我有一個指令（D1）這是我在一個模式彈出平原標記根。我有一個指令（D2）在控制器的作用域（C1）中。我想讓D2在模態D1內設置內容。我有一個注入到C1的服務（S1），它將數據從我想要最終注入到D1的網絡中提取出來。

D1將如下（爲一個模態純標記）： enter image description here

D1將S1之後如下在C1數據返回到D2填充D1。 D2將負責定義D1中的模型數據，例如{{title}}。 enter image description here

這個想法是有一個通用的解耦模態（D1），可以通過另一個指令（D2）定義/填充。

我很難實現此功能。獎勵積分，我想讓D1有一個我可以調用的API來填充不同元素，如複選框，輸入，文本等。這與在D1之外建立標記然後將其完全注入到D1中不同。

的代碼基礎是：

myApp.controller('C1', function(S1){ 
    var results = S1.query(); 
    // populate D1 attributes with results from S1? or a getter function in the controller to returns results to D1. 
} 

myApp.directive('D1', function() { 
var createCheckBox = function(name){ // one of many different element available exposed through D1's API. 
    var checkbox = document.createElement('input'); 
    checkbox.type = 'checkbox'; 
    checkbox.name = name; 
    return checkbox; 
} 
return{ 
    restrict: "E", 
    templateUrl: '/path/to/my/modal.html', 
    controller: function($scope){ // hopefully this would be D1's API 
     $scope.modalContent = []; 
     this.addCheckBox = function(checkboxName){ 
      $scope.push(this.createCheckBox(checkboxName)); 
     } 
    } 
    link: function(scope, element, attrs){ 
     // set up events on the modal (such as closing it) 
    } 
} 
} // end of D1 

myApp.directive('D2', function() { 
    return{ 
     restrict: "A", 
     require: 'D1', // <-- do not think this is possible with my setup. 
     link: function(scope, element, attrs){ 
      element.bind('click', function(){ 
       // loop through data returned by service 
       D1.addCheckBox(/* checkbox's name */); 
       // end loop 
      }); 

     } 
    } 
}// end of D2

HTML標記

<div ng-controller="root"> 
    <div ng-controller="C1"> 
    <span D2></span> 
    </div> 
    <D1></D1> 
</div>

謝謝你遠遠以下這個！

TL; DR：尋找另一個問題來幫着

來源

2013-02-28 shaselton

如果D1負責所有渲染，D2是否需要指令？它不是一個控制器嗎？ – 2013-02-28 20:05:26

我相信D1只是一種可以出現在任何頁面標記之外的模式。我認爲問題是D2如何與D1通信？ – Jonnybojangles 2013-02-28 21:56:45

這是我對類似問題的回答：http://stackoverflow.com/questions/14883476/angularjs-call-method-in-directive-controller-from-other-controller/14884646#14884646。 – satchmorun 2013-03-01 00:47:31

哇長的問題！不知道我明白這一切，但繼Jonnybojandles評論...

你可以$broadcast和$on？

$rootScope.$broadcast('MyEvent'); // Fire an event 

$scope.$on('MyEvent', function() { }); // Handle the event

或者乾脆用$rootScope？

來源

2013-04-04 14:25:33 Greg

Angularjs指令，指令 - 控制器 - 服務交互

回答

相關問題