將obj從指令傳遞到AngularJS中的控制器

Question

我正在嘗試編寫一條指令，以獲取父控制器和父表單控制器，並將它們作為單個對象傳遞給控制器​​，這就是我所擁有的：

HTML：

<div ng-controller="ParentController as self" ng-form="ParentForm">

  <div ng-controller="ChildController1 as self" my-parent="self.parent">
    ChildController1 parent:<br/>
    {{self.parent}}
  </div>

  <br/>

  <div ng-controller="ChildController2 as self" my-parent="self.parent">
    ChildController2 parent:<br/>
    {{self.parent}}
  </div>

</div>

JS：

myApp.directive('myParent', function() {
  var directive = {
    restrict: 'A',
    link: link
  };

  return directive;

  function link(scope, element, attrs) {
    var parentElement = element.parent();
    var parentCtrl = parentElement.controller();
    var formCtrl = parentElement.controller('form');

    var parent = parentCtrl;
    parent.form = formCtrl;

    console.log("directive parent obj: ", parent);

    // How can I pass the parent obj to controller???
  }
});

我在這里寫了一個小插曲，以更好地解釋這種情況： https ://plnkr.co/edit/axnR6t2Q82IVtzftq7y7?p=preview

我知道在這種情況下，我可以在控制器中使用具有不同名稱的controllerAs，但是我需要使其與指令（“ restrict：A”指令）一起使用。

有人可以幫我解決這個問題嗎？

Answer 1

如果您沒有為指令聲明自己的作用域，則指令作用域與控制器作用域相同，因此控制器和指令可以訪問相同的作用域數據。 如果需要在從指令啟動的控制器中執行某些操作，則可以在控制器watch范圍變量中使用$scope.watch 。

如果您需要將變量從一個組件傳遞到另一個組件（從控制器到指令，反之亦然），請使用服務 。 帶有getter和setter的示例服務：

app.service("myService",function(){

  this.data;

  this.setData=function(val){

     this.data=val;
  };

  this.getData=function(val){

      return this.data;

  };

});

在控制器中添加服務並使用setData ，然后將其添加到指令中並調用getData 。

控制器代碼示例：

myService.setData(this.form);

指令示例

var form=myService.getData();