我有以下代码:
<div id='parent'>
<div id='child1'>
<my-select></my-select>
</div>
<div id='child2'>
<my-input></my-input>
</div>
</div>
我也有两个指令,它们从数据工厂获取一些数据。我需要两个指令相互通信,以便当选择框中的值更改时,输入中的内容也会相应更改。
这是我的两个指令:
.directive("mySelect", function ($compile) {
return {
restrict: 'E',
scope:'=',
template: " <select id='mapselectdropdown'>\
<option value=map1>map1</option> \
<option value=map2>map2</option> \
</select>'",
link: function (scope, element, attrs) {
scope.selectValue = //dont konw how to get the value of the select
}
};
})
.directive("myInput", function($compile) {
return {
restrict: 'E',
controller: ['$scope', 'dataService', function ($scope, dataService) {
dataService.getLocalData().then(function (data) {
$scope.masterData = data.input;
});
}],
template: "<input id='someInput'></input>",
link: function (scope, element, attrs) {
//here I need to get the select value and assign it to the input
}
};
})
从本质上讲,这将执行onchange()函数,您可以在select上添加该函数。有任何想法吗?
最佳答案
您可以使用$rootScope
广播另一个控制器侦听的消息:
// Broadcast with
$rootScope.$broadcast('inputChange', 'new value');
// Subscribe with
$rootScope.$on('inputChange', function(newValue) { /* do something */ });
Read Angular docs here
关于javascript - 在AngularJS中的两个指令之间共享数据,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/29584961/