# Angularフォーマッター

このAngularフォーマッターでAngularコンポーネントのテンプレートを整形できます。構造ディレクティブ、バインディング、補間を含むテンプレートHTMLを貼り付けると、div、section、p、ul、tableなどのブロック要素を2スペースのインデントで独立した行に配置し、余分な空白を整理して、インラインのscriptブロックとstyleブロックも整形します。ディレクティブ、バインディング、式は記述どおりに保持されるため、Angular開発者はすばやく整ったテンプレートを得られます。

## よくある質問

### Angularフォーマッターでは何を整形できますか？

Angularコンポーネントのテンプレート、つまり.component.htmlファイルやテンプレート文字列内に記述するHTMLを整形します。TypeScriptコンポーネントクラスはここでは扱いません。クラスの整形にはTypeScriptフォーマッターを使用してください。

### ディレクティブとバインディングは保持されますか？

はい、*ngIf、*ngFor、[value]、(click)、[(ngModel)]などの属性や、{{ user.name }}のような補間は、記述どおりにコピーされます。変更されるのは要素間の空白だけです。

### どの要素が独立した行に配置されますか？

要素にdiv、section、article、header、footer、nav、main、form、p、h1からh6、ul、ol、tableなどのブロックレベルの子要素が含まれる場合、各子要素はインデント付きの独立した行に配置されます。そのような子要素がない場合は1行に保たれ、連続する空白は1つのスペースにまとめられます。

### カスタムコンポーネントが1行のままなのはなぜですか？

app-rootやmat-cardなどのカスタム要素はブロックレベルのHTML要素ではないため、divやpなどのブロック要素を含まない限り、内容はインラインのままです。展開して表示するには、内容をブロック要素で囲んでください。

### リスト項目は別々の行に配置されますか？

liはブロックレベルのタグではないため、それだけでは別々の行になりません。子要素がliだけのulは1行のままです。項目を複数行にするには、各項目の中にdivなどのブロックコンテンツを入れてください。

### scriptタグとstyleタグはどうなりますか？

インラインのstyleブロックはCSSとして、インラインのscriptはJavaScriptとして整形され、タグの下にインデントして配置されます。pre要素とtextarea要素の内容は記述どおりに保持されます。

### HTMLコメントは保持されますか？

はい、HTMLコメントは保持され、展開された要素内の独立した行に配置されます。内容はそのままコピーされるため、コメントアウトされたマークアップも変更されません。

### テンプレートの検証も行いますか？

いいえ。テンプレートのコンパイルや検査は行わず、閉じられていないタグも可能な範囲で整形します。テンプレートのエラーを見つけるには、ng buildまたはエディターのAngular言語サービスを使用してください。

### 出力がhtmlのコードフェンスで囲まれているのはなぜですか？

AngularテンプレートはHTMLなので、結果はhtmlと記されたMarkdownコードブロックとして返されます。テンプレートファイルには、フェンスの間の行をコピーしてください。

### テンプレートのサイズ上限はどれくらいですか？

1回につき最大5 MBを処理できます。それを超える入力はメッセージとともに拒否されます。出力はCode FormatterのAngularオプションと同じです。

ここに広告を掲載しませんか？

[メールでお問い合わせ](mailto:hi@dennn.is?subject=OneClick%20Pro%E3%81%A7%E3%81%AE%E5%BA%83%E5%91%8A%E6%8E%B2%E8%BC%89)

[広告 WordPress向けのエージェント対応プラグインスイート。](https://sleekwp.com/?ref=oneclickpro)