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指令，指令 - 控制器 - 服务交互

回答

相关问题