javascript - angularJS指令如何暴露API給外面的controller使用?
問題描述
<button>expand</button><my-menu></my-menu>
我想點(diǎn)擊按鈕就展開menu,但怎么將menu的API暴露出來給button使用呢?或者有沒有其他更好的做法?
問題解答
回答1:不需要暴露什么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...這篇文章
回答3:提供一個(gè)方法可以在指令中進(jìn)行emit, 然后controller進(jìn)行on監(jiān)聽另外,一般指令是外部像內(nèi)部傳值 才能達(dá)到指令的靈活性 ,如果這樣每次修改API不是得修改指令了?
相關(guān)文章:
1. docker - 如何修改運(yùn)行中容器的配置2. javascript - Web微信聊天輸入框解決方案3. 請教各位大佬,瀏覽器點(diǎn) 提交實(shí)例為什么沒有反應(yīng)4. docker images顯示的鏡像過多,狗眼被亮瞎了,怎么辦?5. javascript - 為什么form表單提交沒有跨域問題,但ajax提交有跨域問題?6. javascript - Ajax加載Json時(shí),移動端頁面向左上角縮小一截兒,加載完成后才正常顯示,這該如何解決?7. javascript - history.replaceState()無法改變query參數(shù)8. javascript - 移動端textarea不能上下滑動,該怎么解決?9. javascript - 關(guān)于audio標(biāo)簽暫停的問題10. javascript - 音頻加載問題
