問題描述

<button>expand</button><my-menu></my-menu>

我想點(diǎn)擊按鈕就展開menu,但怎么將menu的API暴露出來給button使用呢？或者有沒有其他更好的做法？

問題解答

不需要暴露什么API， 你只需要在指令上使用自定義屬性進(jìn)行數(shù)據(jù)雙向綁定即可。比如你需要顯示隱藏，你就在指令上使用一個(gè)display屬性，例如：

<my-menu display='someCtrlValue' ></my-menu>

然后在你的控制器中去控制這個(gè)值，比如

if(condition){ $scope.someCtrlValue = true; }

當(dāng)然指令中你只需要指定雙向綁定的屬性即可；

Module.directive('myMenu', function(){ return { scope: { display : ’=’ } ... } })回答2：

你可以在寫my-menu指令的時(shí)候，指定一個(gè)雙向綁定屬性，比如collapse,然后通過<my-menu collapse='val'></my-menu>這樣使用，然后通過button的ng-click事件控制val變量(true/false)就可以。然后在定義指令時(shí)，通過獨(dú)立作用域?qū)崿F(xiàn)雙向綁定，可參考http://xgfe.github.io/2015/12...這篇文章

提供一個(gè)方法可以在指令中進(jìn)行emit， 然后controller進(jìn)行on監(jiān)聽另外，一般指令是外部像內(nèi)部傳值 才能達(dá)到指令的靈活性 ，如果這樣每次修改API不是得修改指令了？