javascript - angularJS指令如何暴露API給外面的controller使用?
問題描述
<button>expand</button><my-menu></my-menu>
我想點(diǎn)擊按鈕就展開menu,但怎么將menu的API暴露出來給button使用呢?或者有沒有其他更好的做法?
問題解答
回答1:不需要暴露什么API, 你只需要在指令上使用自定義屬性進(jìn)行數(shù)據(jù)雙向綁定即可。比如你需要顯示隱藏,你就在指令上使用一個display屬性,例如:
<my-menu display='someCtrlValue' ></my-menu>
然后在你的控制器中去控制這個值,比如
if(condition){ $scope.someCtrlValue = true; }
當(dāng)然指令中你只需要指定雙向綁定的屬性即可;
Module.directive('myMenu', function(){ return { scope: { display : ’=’ } ... } })回答2:
你可以在寫my-menu指令的時候,指定一個雙向綁定屬性,比如collapse,然后通過<my-menu collapse='val'></my-menu>這樣使用,然后通過button的ng-click事件控制val變量(true/false)就可以。然后在定義指令時,通過獨(dú)立作用域?qū)崿F(xiàn)雙向綁定,可參考http://xgfe.github.io/2015/12...這篇文章
回答3:提供一個方法可以在指令中進(jìn)行emit, 然后controller進(jìn)行on監(jiān)聽另外,一般指令是外部像內(nèi)部傳值 才能達(dá)到指令的靈活性 ,如果這樣每次修改API不是得修改指令了?
相關(guān)文章:
1. 數(shù)組按鍵值封裝!2. docker不顯示端口映射呢?3. java - 阿里的開發(fā)手冊中為什么禁用map來作為查詢的接受類?4. java - 無法執(zhí)行該操作,因?yàn)殒溄臃?wù)器 "***" 的 OLE DB 訪問接口 "SQLNCLI" 無法啟動分布式事務(wù)。解決方法?5. 主題切換問題,用過別人的webapp在后臺切換模板主題后手機(jī)端打開網(wǎng)頁就是切換到的主題了6. javascript - 為什么創(chuàng)建多行多列的表格最后只有一行內(nèi)有表格7. javascript - 使用vue官方腳手架進(jìn)行單元測試,如何覆蓋到watch里的變量?8. clone - git sourceTree克隆倉庫時,都不停彈出Password Required彈窗,即時輸入正確的git賬號密碼還是彈出9. javascript - webpack中alias配置中的“@”是什么意思?10. html5 - 使用echarts中的圖表 一個頁面導(dǎo)入了好幾個js圖表 實(shí)現(xiàn)echarts圖表隨著瀏覽器窗口變化而變化時出現(xiàn)了問題
