2016-11-24 35 views
1

我想將父指令的值傳遞給子指令。在這種情況下,父指令有一個函數,需要在點擊子指令的div時執行,並將子指令的ng-model值傳遞給父指令的調用函數。使用函數綁定將值從一個指令傳遞給另一個指令'&'

http://jsfiddle.net/Lvc0u55v/12543/

var myApp = angular.module('myApp', []); 
 
myApp.directive('parentDirective', function() { 
 
    return { 
 
    restrict: 'EA', 
 
    transclude: true, 
 
    template: '<div>Parent directive</div>', 
 
    link: function(scope) { 
 
     scope.someFunc = function(value) { 
 
     alert(value); 
 
     } 
 
    } 
 
    } 
 
}); 
 
myApp.directive('childDirective', function() { 
 
    return { 
 
    restrict: 'EA', 
 
    template: '<input type="text" ng-model="data.name"><button ng-click="issue(data.name)">Child Directive</button>', 
 
    scope: { 
 
     issue: '&' 
 
    } 
 
    } 
 
});
<div ng-app="myApp"> 
 
    <parent-directive ng-transclude> 
 
    <child-directive issue="someFunc()"></child-directive> 
 
    </parent-directive> 
 
</div>

JSfiddle link

回答

0

我已經更新您的JSFiddle恰當的解決方案。

當您在父指令中綁定函數時,您需要指定參數。

<child-directive issue="someFunc(value)"></child-directive> 

並傳遞一個對象作爲你的子指令中的鍵。

<button ng-click="issue({ value: data.name })">Child Directive</button> 
+1

Awsome !! 我的壞我沒有指定父指令:( 參數可是爲什麼我必須通過參數作爲?? 鍵{值:data.name}爲什麼只有data.name沒有工作? –

+0

不用擔心,這是一個非常常見的錯誤,這就是AngularJS的工作原理 – Puigcerber

+0

可能[this](http://www.codelord.net/2016/05/13/understanding-angulars-and-binding/)是一種很好的文章解釋了爲什麼。 – Puigcerber

相關問題