AngularJS式
AngularJSは式を使用してデータをHTMLにバインドします。
AngularJS式は、二重ブレースで書かれています： {{expression}} 。
AngularJS式は、データをHTMLにバインドします。これは、NG-Bindディレクティブに似ています。
AngularJSは、式が記述されている場所でデータを「出力」します。
AngularJS式は、 JavaScriptの式によく似ています。リテラル、演算子、および変数を含めることができます。
instance {{5 + 5}}または{{firstName + "" + lastName}}}
例コード：
<！Doctype html> <html> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app> <p> <p> }} </p> </div> </body> </html>
実行結果：
私の最初の表現：10
AngularJS数
Angularjs数はJavaScript番号のようなものです。
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "数量= 1; cost = 5"> <p>合計価格：{{数量 *コスト}} </p> </div> </body> </html>実行結果：
合計価格：5
ng-bindを使用した同じ例：
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "数量= 1; cost = 5"> <p>合計価格：<span ng-bind = "数量 * cost"> </span> </p> </div> </body> </html>
実行結果：
合計価格：5
注： ng-initの使用はあまり一般的ではありません。コントローラーの章でデータを初期化するより良い方法を学びます。
Angularjs文字列
AngularJS文字列はJavaScript文字列のようなものです。
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "firstName = 'john'; lastName = 'doe'"> <p> name：{{firstName + "" + lastName}} </p> </div> </body> </html>実行結果：
名前：ジョン・ドー
ng-bindを使用した同じ例：
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "firstName = 'john'; lastname = 'doe'"> <p> name：<span ng-bind = "firstName + '' + lastName"> </span> </p> </div> </body> </html>
実行結果：
名前：ジョン・ドー
AngularJSオブジェクト
AngularJSオブジェクトはJavaScriptオブジェクトのようなものです。
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "person = {firstName： 'john'、lastName： 'doe'}"> <p>姓は{{person.lastname}} </p> </div> </body> </html>です実行結果：
名前が付けられました
ng-bindを使用した同じ例：
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "person = {firstName： 'john'、lastName： 'doe'}"> <p>姓は<span ng-bind = "person.lastname"> </span> </p> </div> </body> </html>です実行結果：
名前が付けられました
AngularJSアレイ
AngularJSアレイは、JavaScriptアレイのようなものです。
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "ポイント= [1,15,19,2,40]"> <p> 3番目の値は{{points [2]}} </p> </div> </body> </html>です実行結果：
3番目の値は19です
ng-bindを使用した同じ例：
例コード：
<！Doctype html> <HTML> <head> <meta charset = "utf-8"> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </scrip> </head> <body> <div ng-app = "" " ng-init = "ポイント= [1,15,19,2,40]"> <p> 3番目の値は<span ng-bind = "points [2]"> </span> </p> </div> </body> </html>です
実行結果：
3番目の値は19です
AngularJS式とJavaScript式
JavaScriptの式と同様に、AngularJS式には文字、演算子、および変数が含まれています。
JavaScript式とは異なり、AngularJS式はHTMLで記述できます。
JavaScriptの式とは異なり、AngularJS式は条件付き判断、ループ、例外をサポートしていません。
JavaScript式とは異なり、AngularJS式はフィルターをサポートします。
上記は、AngularJS発現材料の編集です。後で追加し続けます。 Angularjsを学ぶのに役立つことを願っています同級生。