<small id="nvnkc"><optgroup id="nvnkc"><sub id="nvnkc"></sub></optgroup></small>

<th id="nvnkc"><div id="nvnkc"></div></th>
  • <noscript id="nvnkc"><nobr id="nvnkc"><address id="nvnkc"></address></nobr></noscript>

  • <code id="nvnkc"><var id="nvnkc"></var></code><tbody id="nvnkc"><listing id="nvnkc"><nav id="nvnkc"></nav></listing></tbody>

    AngularJS Batarang - Angular調試插件

    發布時間: 編輯:Chromegood 0人評論 7157次瀏覽 Chrome開發者工具插件
    直達下載
    摘要 : angularjs batarang插件是一款功能強大的可以安裝到谷歌瀏覽器上使用的Angular調試插件,安裝使用這款angularjs batarang插件可以讓你在開發過程中更加便捷。

    AngularJS Batarang插件背景簡介

    如果你如今從事前端開發,大行其道的MVVM框架,決計是繞不過去的存在。那么以下是三大流行框架 Devtools,如需自取。Vue.js devtools、AngularJS BatarangReact 、Developer Tools。本文主要介紹的就是AngularJS Batarang

    AngularJS Batarang插件簡介

    angularjs batarang是針對谷歌瀏覽器用戶打造的一款增強插件,該插件主要方便開發者進行腳本的編譯和調試操作,可以有效地加速開發者的進程,是您調試AngularJS程序的好幫手,安裝后就會多個batarang的選項,可以查看scope的信息或者對應的模型信息,同時還可以查看應用的性能。

    AngularJS Batarang插件簡介

    AngularJS Batarang插件使用方法

    1.AngularJS Batarang插件離線安裝的方法參照一下方法:老版本chrome瀏覽器,首先在標簽頁輸入【chrome://extensions/】進入chrome擴展程序,解壓你在本站下載的插件,并拖入擴展程序頁即可。

    AngularJS Batarang插件使用方法

    2.最新版本的chrome瀏覽器直接拖放安裝時會出現“程序包無效CRX-HEADER-INVALID”的報錯信息,參照:Chrome插件安裝時出現"CRX-HEADER-INVALID"解決方法,安裝好后即可使用。

    AngularJS Batarang插件使用方法

    3.安裝完畢后圖標會出現在插件欄里。

    AngularJS Batarang插件使用方法

    4.在chrome瀏覽器中打開一個Angular應用,并打開控制臺,如下圖,會發現控制臺中多了一個AngularJS的頁面,勾選“Enable”,該控件就可以使用了。

    AngularJS Batarang插件使用方法

    5.點開Models,如下圖,左側是該應用下的所有Scope的信息,右側是Scope對應的模型信息。點擊某個作用域,右側相應的會顯示出該作用域中的所有模型信息。 點擊Scope前的”<”,會跳到Elements中該作用域所在的DOM標簽上。

    AngularJS Batarang插件使用方法

    6.Performace展示的是該應用的性能,左側顯示的是監控樹,點擊樹的節點,跳轉至相應的element元素上。右側顯示的是監控表達式的性能,這個頁面能幫助我們進行性能優化。

    AngularJS Batarang插件使用方法

    7.Dependenices展示的指令和服務之間的依賴關系,選定某個指令,可以看到其依賴的服務。通過圖表把服務之間的依賴關系可視化,紅線代表依賴

    AngularJS Batarang插件使用方法

    8.最后是options頁面。有三個選項:”show applications,” “show scopes,” 和 “show bindings.”。每個選項勾選時,在debugger時,相應的內容會在頁面高亮。

    AngularJS Batarang插件使用方法

    9.如有任何問題,請查看help

    AngularJS Batarang插件使用方法

    10.在Element標簽中選定某個標簽時,Element頁面的右側的內容,會多一個AngularJS Properties頁面,該頁面顯示的是選定的html內容的作用域的屬性,該功能對于對Angular Scope的理解非常有用。如果不是很理解Angular Scope,可以多用一個這個功能。

    AngularJS Batarang插件使用方法

    查看更多

    AngularJS Batarang - Angular調試插件下載地址

    點擊下載AngularJS Batarang - Angular調試插件

    轉載必須注明來自: Chrome插件 ? AngularJS Batarang - Angular調試插件

    基于REST的Web服務客戶端

    基于REST的Web服務客戶端

    3 人評論 61169 次人瀏覽 3.0分 3.0 分
    基于REST的Web服務客戶端是一款可以使用Chrome插件來模擬REST請求來測試REST風格的web Api的谷歌瀏覽器插件。
    開發常用工具(Develop Tools)

    開發常用工具(Develop Tools)

    0 人評論 14199 次人瀏覽 3.0分 3.0 分
    開發常用工具(Develop Tools)是一款可以為我們提供一些常用的開發工具的插件。比如Unix時間戳、URL編碼/解碼、漢字轉換拼音、ip地址查詢、加密(MD5,MD4,SHA1)、BASE64編碼/解碼等,它能夠輔助一些網頁開發人員進行編程工作。
    AlloyDesigner - 前端開發工具

    AlloyDesigner - 前端開發工具

    0 人評論 7978 次人瀏覽 3.0分 3.0 分
    AlloyDesigner是一款免費的web前端開發工具,它可以直接嵌入你的Web頁面中運行,幫助你精準、高效的構建Web頁面的UI。
    Brackets - 一款免費的前端開發工具

    Brackets - 一款免費的前端開發工具

    0 人評論 1675 次人瀏覽 3.0分 3.0 分
    Brackets是一款現代化的文本編輯器,具有集中的可視化工具和預處理器支持,可輕松在瀏覽器中進行設計。它是專為網頁設計師和前端開發人員設計的。
    下一篇 : v2ex-plus
    av看片免费观看网址
    評論:(0)

    已有 0 位網友發表了一針見血的評論,你還等什么?

    ?