今天給大家分享一下，修真院官網js-9任務中如何使用自定義指令封裝翻頁外掛程式
一、背景介紹
對於指令，可以把它簡單的理解成在特定dom元素上執行的函式，指令可以擴充套件這個元素的功能。 例如，一些原生的指令如 ng-disabled ， ng-if ，ng-repeat ，ng-click 等。ng-click可以讓乙個元素能夠監聽click事件，並在接收到事件的時候執行angularjs表示式。正是指令使得angularjs這個框架變得強大，並且在angularjs我們可以自己通過directive來創造新的指令。
二、知識剖析
關於指令，因為我們是有直接講指令的小課堂的，所以這裡就簡單說一下。
angular指令本質上就是angularjs擴充套件具有自定義功能的html元素的途徑。
內建指令，打包在angularjs內部的指令，所有內部指令的命名空間 都使用ng作為字首，所以在寫自定義指令的時候，避免用ng作為指令命名的字首。
建立指令的方式有四種，在指令裡用 restrict屬性控制:
e:元素
a:屬性
c:css類
m:注釋
向指令中傳遞資料，用template屬性
directive 在使用隔離 scope 的時候，提供了三種方法同隔離之外的地方互動：
@ 繫結乙個區域性 scope 屬性到當前 dom 節點的屬性值。結果總是乙個字串，因為 dom 屬性是字串。
= 通過 directive 的 attr 屬性的值在區域性 scope 的屬性和父 scope 屬性名之間建立雙向繫結。
& 提供一種方式執行乙個表示式在父 scope 的上下文中。如果沒有指定 attr 名稱，則屬性名稱為相同的本地名稱。（其實說白了，就是可以使用在父scope中定義的函式。）
replace：是否用模板替換當前元素。
四、解決方案
看demo
五、編碼實戰
六、拓展思考
分頁功能還可以怎麼做？
a1：比如說封裝上傳外掛程式、輪播圖
q2：directive自定義指令中的scope作用和注意點
a2：建立乙個作用域，用於傳遞資料
q3：指令中controller跟link的區別?
a3：這兩個都可以獲取到作用域，元素，屬性等引用，也都會執行一次。那當我們每次想要擴充套件個自定義指令時，應該用哪個？
控制器可以暴露乙個api，而link可以通過require與其他的指令控制器互動
所以如果要開放出乙個api給其他指令用就寫在controller中，否則寫在link中。簡單來說，優先使用link。
vue 自定義指令如何使用
指令的註冊方式和 過濾器 混入 元件 註冊的方式一樣都分為兩種 一是全域性註冊，二是區域性註冊。1.全域性註冊 vue.directive name 2.區域性註冊 directives 然後在模版中直接使用即可。你好，六哥在這 vue 提供了自定義指令的幾個鉤子函式 bind 指令第一次繫結到元素...
vue 自定義指令如何使用
vue 自定義指令如何使用 全域性指令 使用 vue.diretive 來全域性註冊指令。區域性指令 也可以註冊區域性指令，元件或 vue 建構函式中接受乙個 directives 的選項。鉤子函式。指令定義函式提供了幾個鉤子函式 可選 bind 只呼叫一次，指令第一次繫結到元素時呼叫，用這個鉤子函...
封裝自定義指令簡單說明
vue.directive 指令名 函式 會在當前標有這個自定義指令的元素被新增到頁面上之後，自動呼叫該 函式。當自動呼叫 函式時，會自動將當前帶有自定義指令的元素物件傳入inserted函式內 inserted 當前dom元素物件 對當前dom元素物件執行一些初始化操作 如果指令名包含多個英文單詞...