Как получить доступ значения переменных в одной пользовательской директиве в другой пользовательской директиве

Question

я сделал 2 пользовательских директивы и я использую их в любом HTML-коде, как этот

<div textbox-component > </div> <div grid-component ></div>

Первый делает текстовое поле и Когда мы нажимаем на кнопку, она возвращает объект. Я хочу передать этот объект во вторую директиву, которая берет объект и создает его таблицу. Возможно ли это каким-либо образом в Angular JS.

Answer 1

Да, используйте свойство на $scope, которое используется совместно с родительской областью. Я использую контроллер здесь в качестве родительской области:

module.controller('foo', function($scope) { 
    $scope.bar = {}; 
}); 

module.directive('textboxComponent', function() { 
return { 
    ... 
    scope: { 
     sharedObj: '=' 
    }, 

    link: function($scope) { 
     $scope.doSomething = function() { 
      $scope.sharedObj.test = 'hello world!'. 
     } 
    } 
}; 
}); 

// same definition using `scope` for gridComponent 

И теперь вы установили, что области видимости объекта:

<div ng-controller="foo"> 
    <div textbox-component shared-obj="bar"> 
     let us assume what follows inside is the template of this component 

     <a ng-click="doSomething()">click me</a> 
    </div> 
    <div grid-component shared-obj="bar"> 
     let us assume what follows inside is the template of this component 

     {{sharedObj.test}} 
    </div> 
</div> 

В функции связи с gridComponent вы также можете сделать это, если вам нужно знать, когда sharedObj изменяется от внешнего (другой директивы):

$scope.$watch('sharedObj', function() { 
    console.log($scope.sharedObj.test); 
}, true); 

Вы также можете использовать $broadcast но это просто неправильно в этом продолжение ext ...