[解決済み] Angular2の括弧、括弧、アスタリスクの違いは何ですか?
質問
のAngular 1 to 2クイックリファレンスを読んでいます。 Angularウェブサイト この特殊文字の違いについて、私は完全に理解していませんでした。例えば、アスタリスクを使用するものがあります。
<tr *ngFor="#movie of movies">
<td>{{movie.title}}</td>
</tr>
ここで理解したのは、ハッシュ(#)記号で定義された
movie
をローカルテンプレート変数として使用することができますが、その前のアスタリスクは何を意味するのでしょうか?
ngFor
の意味は?そして、それは必要なのでしょうか?
次に、括弧を使った例です。
<a [routerLink]="['Movies']">Movies</a>
を括弧で囲むのはなんとなくわかるのですが
routerLink
は、そのHTML属性/Angularディレクティブにバインドされます。これは、Angularが式を評価するためのポインタということでしょうか?例えば
[id]="movieId"
は、次のものと同等です。
id="movie-{{movieId}}"
Angular 1では?
最後に、括弧です。
<button (click)="toggleImage($event)">
これらはDOMイベントのみに使用され、他のイベント、例えば
(load)="someFn()"
または
(mouseenter)="someFn()"
?
本当の疑問は、これらの記号はAngular 2で特別な意味を持つのか、そしてそれを知る最も簡単な方法は何かということです。 を使用する必要があります。 ? ありがとうございます!
解決方法は?
詳細はこちらでご確認ください。 https://angular.io/docs/ts/latest/guide/template-syntax.html
-
directiveName
- は、構造ディレクティブのショートハンド形式で、ロングフォルムは<template>
タグを使用します。短い形式は、適用される要素を暗黙のうちに<template>
. -
[prop]="value"
はプロパティへのオブジェクトバインディング用 (@Input()
Angularコンポーネントやディレクティブ、またはDOM要素のプロパティ)。
特殊な形式があります。-
[class.className]
は、CSS クラスにバインドして有効/無効を切り替えます。 -
[style.stylePropertyName]
は、スタイルプロパティにバインドされます。 -
[style.stylePropertyName.px]
は、プリセットユニットを持つスタイルプロパティにバインドされます。 -
[attr.attrName]
値を属性にバインドする(DOMでは見えるが、プロパティは見えない)。 -
[role.roleName]
はARIAのrole属性にバインドする(まだ利用できない)
-
-
prop="{{value}}"
はプロパティに値をバインドします。値は文字列化される(別名、補間) -
(event)="expr"
は、イベントハンドラを@Output()
またはDOMイベント -
#var
または#var
は、コンテキストによって異なる機能を持ちます-
<ストライク
での
*ngFor="#x in y;#i=index"
反復処理のためのスコープ変数が作成されます
(beta.17では *ngFor="let x in y; let i=index"` に変更されています) -
DOM要素について
<div #mydiv>
要素への参照 - Angularコンポーネントの場合 コンポーネントへの参照
-
Angular コンポーネント、または Angular ディレクティブを持つ要素で
exportAs:"ngForm"
が定義されています。#myVar="ngForm"
は、このコンポーネントやディレクティブへの参照を作成します。
-
<ストライク
での
関連
-
[解決済み] コンストラクタとngOnInitの違いについて
-
[解決済み] Angular 2+でngShowとngHideに相当するものは何ですか?
-
[解決済み] NgModuleにおける宣言、プロバイダ、インポートの違いは何ですか?
-
[解決済み] SubjectとBehaviorSubjectの違いは何ですか?
-
[解決済み】PromiseとObservablesの違いは何ですか?
-
[解決済み】@ViewChildと@ContentChildの違いは何ですか?
-
[解決済み】Angularコンポーネントとモジュールの違いとは?
-
[解決済み】markForCheck()とdetectChanges()の違いは何ですか?)
-
[解決済み】HttpModuleとHttpClientModuleの違いについて
-
[解決済み] Angularでオブジェクトを繰り返し処理する【重複】。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Node Sass は現在の環境のためのバインディングを見つけることができませんでした。Windows 64ビット、Node.js 8.x。
-
[解決済み] Angular HTMLバインディング
-
[解決済み] Angularで@Input()の値が変更されたときに検出する方法は?
-
[解決済み】コンポーネントのプロパティが現在の日付時間に依存している場合、Angular2の「expression has changed after it was checked」例外を管理する方法
-
[解決済み】take(1) vs first()
-
[解決済み] npm start」と「ng serve」はいつ使う?
-
[解決済み] Angular 2のパッシブリンク - <a href="">相当
-
[解決済み] AngularのHttpClientでエラーをキャッチする
-
[解決済み] AngularでngFor repeatをある数のアイテムに制限するにはどうすればよいですか?
-
[解決済み] VSCodeでAngularをデバッグする方法とは?