angular.element

將DOM元素或者HTML字符串一包裝成一個jQuery元素。

格式：angular.element(element);

element：包裝成jquery對象的html字符串或者dom元素

jqLite提供的方法：

• addClass()
• after()
• append()
• attr()
• bind()?– 不支持命名空間,選擇器和事件數據
• children()?– 不支持選擇器
• clone()
• contents()
• css()
• data()
• empty()
• eq()
• find()?– 通過標簽名稱限定查找
• hasClass()
• html()
• next()?– 不支持選擇器
• on()?– 不支持命名空間或選擇器
• off()?–不支持命名空間或選擇器
• one()?– 不支持命名空間或選擇器
• parent()?– 不支持選擇器
• prepend()
• prop()
• ready()
• remove()
• removeAttr()
• removeClass()
• removeData()
• replaceWith()
• text()
• toggleClass()
• triggerHandler()?-通過一個虛擬事件對象來處理。
• unbind()?– 不支持命名空間
• val()
• wrap()

事件：

$destory:當Dom被移除時， Angular 攔截所以的jqLite或者jquery Dom對象，銷毀api和事件。這個事件能在Dom被移除前用來清除任何Dom上的相關。

方法：

controller(name)：檢索當前元素或其父元素的controller，默認情況下，檢索與ngController相關的controller，如果name是以駝峰模式命名的指令名稱，那么這個指令的controller就是這樣（如’ngModel’） 。

injector():檢索當前元素或其父元素的依賴注入。

scope():檢索當前元素或其父元素的scope。

isolateScope():如果有一個scope直接附著在當前元素，檢索一個隔離的scope，這僅用于元素包含一個創建了新的隔離的scope的指令，這個元素調用scope()總是返回原來的非隔離scope。

inheritedData():和data()一樣，但是會沿著Dom走直到值被找到或者走到頂級Dom元素。（由此可見，應該是向上傳播的意思。）

使用代碼：

<div ng-app="Demo"><div ng-controller="testCtrl as ctrl"> <div id="myDiv">Hello World!!!</div> </div> </div
(function () {angular.module("Demo", []).controller("testCtrl", testCtrl);function testCtrl() { var element = angular.element("#myDiv"); console.log(element) //element是個對象 //第一個屬性就是id為myDiv的div對象; //第二個屬性名為content,值是document; //第三個屬性名是length,值為1;第四個屬性名是selector,值是"#myDiv" }; }());

好了，翻譯的都解釋完了，使用的代碼也寫完了注釋解釋了。接下來說說野獸對angular.element的理解。

根據對Angular的理解，在controller里操作Dom是要剁手的...Ng有規定了使用指令對Dom進行操作，像我們在Ng開發中封裝一些jQuery插件使用時，也是通過指令來的。所以，這個方法也應該盡量的在指令中使用。

angular.element把Dom元素或者HTML的字符串包裝成jQuery對象，假如你在angular之前引用了jQuery，那么這就相當于jQuery的選擇器了，你也可以把jQuery的一些dom操作對他使用；那么如果你就是這么任性，不引用jQuery呢？別著急，ng自帶jqLite，上面也把jqLite對這個方法包裝成的對象提供的一些方法都列出來了，有需要的可以去看看哦。

總結

以上是生活随笔為你收集整理的Angular - - angular.element的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。