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
公式URL 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
Eメール [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"
    }
}