AngularJSにおける括弧の役割の詳細な説明

AngularJSにおける括弧の役割の詳細な説明

1. 括弧の役割

1.1 角括弧 [ ]

属性名が角括弧で囲まれている場合、右側には式の値が割り当てられます <br /> 属性に角括弧がない場合、右側には文字列が割り当てられます

<div class="red">red</div> //ここでのクラス名は red です
<div [class]="red">red</div> //ここでのクラス名はblueです。つまり、角括弧の右側は式です。 //コンポーネントredでは: string = "blue";

1.2 括弧()

括弧はイベントバインディングに使用され、要素上でイベントをトリガーし、バインドされたメソッドが応答します。

<div (click)="go()">gogo</div> //括弧内にイベントを入れる //コンポーネントクラス go() {
 //表現...
}

1.3 中括弧 { { }}

中括弧{ {expression}}このメソッドは補間と呼ばれ、テンプレートに配置することができます

<div>{{good}}</div> //<div>こんにちは</div> 
 
//コンポーネントクラス good: string = "Hello";

1.4 文字列変数${ }

tes: 文字列 = "ワールド";
テスト: 文字列 = `Hello ${goo}`; //テスト: 文字列 = "Hello World";

1.5 [()]

双方向バインディング操作によく使用されます

<input [(ngModel)]='test_input' /> // 値= 'testNgClick'
 
//コンポーネント内 test_input: any = 'testNgClick';

AngularJS における括弧の役割に関するこの記事はこれで終わりです。AngularJS における括弧の役割についてさらに詳しく知りたい場合は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • Angular のパフォーマンス最適化: サードパーティ コンポーネントと遅延読み込みテクノロジー
  • Angularフレームワークのビュー抽象定義の詳細な説明
  • Angular SMS テンプレート検証コード
  • Angularにng-zorroを導入する際の問題に関する簡単な分析
  • Angular+IonicはqueryParamsを使用してページジャンプ値の転送を実装します
  • Angularでシンプルなユニットテストを実装する例
  • AngularJs の $http は POST リクエストを送信しますが、PHP は Post データを受信できません。問題と解決策
  • 折りたたみと展開の効果を実現するための Angular+ionic のサンプルコード
  • Angular の 12 の典型的な問題について簡単に説明します

<<:  yum を使用して rpm と関連する依存関係をダウンロードして、docker をオフラインでインストールします。

>>:  CentOS6.7 mysql5.6.33 でデータファイルの場所を変更する方法

推薦する

Nginx がサーバーの生存状態をパッシブにチェックする詳細な説明

導入定期的にヘルスチェックを送信して、アップストリーム グループ内の HTTP サーバーのヘルスを監...

MySQL スロークエリログの詳細な理解

目次スロークエリログとは何ですか?スロークエリを有効にする方法ログ分析ツール mysqldumpsh...

HTML 適応テーブル方式

<body style="scroll:no"> <テーブルの...

MySQL でスロークエリログ機能を有効にする方法

MySQL スロー クエリ ログは、問題のあるクエリを追跡するのに非常に役立ちます。現在のプログラム...

MySQLカスケードレプリケーションの実装方法の例

いわゆるカスケード レプリケーションでは、マスター サーバーが 1 つのスレーブ サーバーにのみデー...

WeChatアプレットタブの左右スライドスイッチ機能実装コード

効果画像: 1. はじめに独自のアプレットでこのような機能を実装する必要がある1. 核となる考え方ス...

MySQL データベース テーブルとデータベース パーティショニング戦略

まず、テーブルを分割する必要がある理由について説明します。データシートが数百万に達すると、1 回のク...

ミニプログラムの基本的な使用方法の知識ポイント(非常に包括的で、お勧めです!)

目次アプリを登録するときに何をすればよいですか?ページを登録するときに通常何をする必要がありますか?...

Vueはログイン認証コードを実装する

この記事では、ログイン認証コードを実装するためのvueの具体的なコードを例として紹介します。具体的な...

jsでライトスイッチの効果を実現

この記事の例では、ライトスイッチ効果を実現するためのjsの具体的なコードを参考までに共有しています。...

JavaScript インタビュー: 配列の平坦化メソッドを実装する方法

目次1 配列のフラット化とは何ですか? 2 JS標準ライブラリの配列フラット化メソッド3 フラットメ...

mysql8.0.19 でパスワードを忘れた場合の完璧な解決策

おすすめの読み物: MySQL 8.0.19 は、間違ったパスワードを 3 回入力するとアカウント ...

適応幅(パーセンテージ)に応じて Div の高さを調整する純粋な CSS

今日のレスポンシブ レイアウトの要件では、サイズを自動的に調整できる多くの要素で高さと幅の適応を実現...

MySQLで適切なインデックスを選択する方法

まずは栗を見てみましょう EXPLAIN select * from employees where...

MySQL LOAD_FILE() 関数メソッドの概要

MySQL では、LOAD_FILE() 関数はファイルを読み取り、その内容を文字列として返します。...