Angular state inspector

Helps you debug Angular component state. Supports Angular 1/2+/Ivy!

什麼是Angular state inspector?

Angular state inspector是由Anton Lunev開發的Chrome擴展程式,該擴展的主要功能是“Helps you debug Angular component state. Supports Angular 1/2+/Ivy!”。

擴展截圖

screenshot
screenshot

下載Angular state inspector擴展crx文件

下載Angular state inspector擴展crx格式的文件,手動將Chrome擴充功能安裝到瀏覽器中,也可以將crx文件分享給朋友,輕鬆安裝Chrome擴充功能。

擴展使用說明

                        Angular State Inspector for Angular

Supports all versions of Angular:
 - AngularJs
 - Angular 2+
 - Angular Ivy
 - Hybrid apps (AngularJs + Angular)

Extends the Chrome Developer Tools for Angular web apps.
Adds new panel "State" to Elements tab, that displays the state of selected element.
Prints state of selected element in console by calling "$state" variable.
 
Depending on angular version it can show: 
  - Component state
  - Directives
  - Context, like ngForOf or ngIf values
  - Event listeners
If they are applicable to the current element.

Angular State Inspector also allows you to modify the values in the "State" panel (double click on value) and from console(e.g. $state.title = 'new value'). 
To apply changes just call $apply() in console.
See all supported commands in chrome console.

Version 1.4.6:
- Show info message if $ctrl is not available in selected scope.
- Update $state object even if it's not available.
Version 1.4.5:
 - [ivy] Show info from ng.getComponent(). If it's null then show OwningComponent state.
Version 1.4.4:
 - update extension logo
Version 1.4.3:
 - Return result emoji on `$apply()` call
Version 1.4.2:
 - Fixed props editing and change detection
Version 1.4.1:
 - Print always up to date state in console
Version 1.4:
 - Full support angular 9 Ivy api
Version 1.3:
 - Added experimental support of Ivy
 - Added shortcuts that you can use in console                    

擴展基本資訊

名稱 Angular state inspector Angular state inspector
ID nelkodgfpddgpdbcjinaaalphkfffbem
官方網址 https://chromewebstore.google.com/detail/angular-state-inspector/nelkodgfpddgpdbcjinaaalphkfffbem
簡介 Helps you debug Angular component state. Supports Angular 1/2+/Ivy!
檔案大小 36.35 KB
安裝次數 35,245
目前版本 1.4.6
更新時間 2021-08-23
上架時間 2020-05-17
評分 4.73/5 共 60 次評分
開發者 Anton Lunev
電子郵箱 [email protected]
付費類型 free
擴展官網 https://github.com/anton-lunev/angular-state-inspector
支援的語言 en
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "manifest_version": 3,
    "name": "Angular state inspector",
    "description": "Helps you debug Angular component state. Supports Angular 1\/2+\/Ivy!",
    "version": "1.4.6",
    "devtools_page": "index.html",
    "author": "Anton Lunev",
    "icons": {
        "16": "img\/icons\/angular-16.png",
        "48": "img\/icons\/angular-48.png",
        "128": "img\/icons\/angular-128.png"
    }
}