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 でデータファイルの場所を変更する方法

推薦する

Zookeeper 不正アクセス テストの問題

目次序文Zookeeper サービスのオープンを検出情報を入手する接続テスト接続先修理計画参照する序...

mysql 5.7.17 winx64.zip インストールと設定方法のグラフィックチュートリアル

はじめに: Windows 10 を再インストールし、同時にファイルを整理しました。しかし、MySQ...

JS でオブジェクト プロパティを簡単にトラバースするいくつかの方法

目次1. 自己列挙可能なプロパティ2. Object.values()はプロパティ値を返します3. ...

Vuexの特性と機能の詳細な説明

目次Vuex とは何ですか? Vuexの5つの特性vuex の State 機能とは何ですか? vu...

CentOS仮想マシンの時刻を変更する方法

上はシステム時間、下はハードウェア時間です。ここでは変更を加えているので、同じくらいの速さになってい...

MySQL のあまり知られていないソート方法

序文ORDER BY 字段名升序/降序、このソートステートメントは皆さんご存知だと思いますが、特殊な...

Ubuntu mysqlログイン名とパスワードを表示および変更し、phpmyadminをインストールする

MySQLをインストールした後、ターミナルでmysql -u root -pと入力してEnterを押...

Vue が DingTalk の出勤カレンダーを実装

この記事では、DingTalkの勤怠カレンダーを実装するためのVueの具体的なコードを参考までに共有...

Nginx 外部ネットワーク アクセス イントラネット サイト構成操作

背景:サイトはフロントエンドとバックエンドから分離されています: vue+springbootフロン...

ローカル写真をアップロードする前にプレビューコード例を実装するための HTML5 と jQuery

HTML5 と jQuery はアップロード前にローカル画像のプレビューを実装しており、その効果は...

Linuxの読み取りコマンドの使用

1. コマンドの紹介read コマンドは、シェルの組み込みコマンドで、標準入力または -u オプショ...

nginx共有メモリの仕組みの詳細な説明

Nginx の共有メモリは、高いパフォーマンスを実現できる主な理由の 1 つであり、主にファイル キ...

CSS3を使用してオンラインライブ放送に似たキューアニメーションを実装する方法

以前、グループの友人が質問しました。つまり、ミニプログラムでユーザーがオンラインになったときに、ライ...

Ubuntu 20.04 ベスト設定ガイド (初心者向け)

1. システム構成1. sudoパスワードをオフにするsudo コマンドを使用するたびにパスワード...

CSS疑似クラス名を数字で始めないでください

初心者が div+css を開発する場合、.ggg、#ccc などの形式の CSS 疑似クラス名を付...