自定義Directive使用ngModel

2021-09-07 22:38:47 字數 1454 閱讀 2026

以上,datasource代表資料來源,是否可以用ng-model替代呢?

比如寫成這樣:

可是,自定義的tablehelper這個direcitve如何獲取到ngmodel中的值呢?

這就涉及到direcitve之間的通訊了,就像在"angularjs中directive間互動實現合成"說的。

要解決的第乙個問題是:如何拿到ngmodel?

--使用require欄位

return

, link: link,

template: template

}

要解決的第二個問題是:如何從ngmodel這個direcitve拿資料?

--大致有4種方法

//

1 觀察某個屬性的值

attrs.$observe('ngmodel', function

(value));

});//

2 或者

scope.$watch(attrs.ngmodel, render);

//3 或者

scope.$watch(function

(),

function

(newvalue))

//4 或者

ngmodel.$render = function

()

相對完整的**如下:

var tablehelperwithngmodel = function

() }

};return

, link: link,

template: template

}}angular.module('direcitvemodule')

.directive('tablehelperwithngmodel', tablehelperwithngmodel)

var tablehelperwithngmodel = function

());

});//或者

scope.$watch(attrs.ngmodel, render);

//或者

scope.$watch(function

(),

function

(newvalue))

//或者

ngmodel.$render = function

()

function

render()}};

return

, link: link,

template: template

}}angular.module('direcitvemodule')

.directive('tablehelperwithngmodel', tablehelperwithngmodel)

vue自定義指令directive

1 指令的使用 v dir1 v color red div type text v focus div 2 建立區域性指令 newvue 建立指令 可以多個 directives color 3 全域性指令,一般在main.js中定義 為繫結的元素自動獲取焦點 vue.directive focu...

vue自定義指令directive

自定義指令 vue框架給開發者提供了許多指令,例如v if v else v html v show v text v model v bind等等,這些指令都是固定的,並不能任意滿足開發需要,有時開發需要乙個指令而框架還沒有提供,就需要開發者自己定義,稱為 自定義指令 關鍵字 directive ...

vue自定義指令 directive

除了核心功能缺省內置的指令,vue也允許註冊自定義指令。有的情況下,對普通 dom 元素進行底層操作,這時候就會用到自定義指令繫結到元素上執行相關操作。自定義指令分為 全域性指令和區域性指令,當全域性指令和區域性指令同名時以區域性指令為準。自定義指令常用鉤子函式 bind 第一次繫結到元素時呼叫 i...