AngularJSエッセイday 1

AngularJSがHTMLを拡張
HTML 5では、dataから始まる拡張(自家製)属性が許可されます.AngularJSプロパティはng-で始まるが、data-ng-を使用してHTML 5に対してWebページを有効にすることができる.
data-ng-model
入力フィールド(input,select,textarea)の値をAngularJSで作成した変数にバインドできます.
双方向バインド

<div ng-app="myApp" ng-controller="myCtrl">
      : <input ng-model="name">
    <h1>    : {{name}}h1>
div>

ユーザー入力の検証

<form ng-app="" name="myForm">
    Email:
    <input type="email" name="myAddress" ng-model="text">
    <span ng-show="myForm.myAddress.$error.email">           span>
form>

 
data-ng-bind

<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>   <span ng-bind="person.lastName">span>p>
div> 

 
AngularJS式とJavaScript式
JavaScript式と同様に、AngularJS式にはアルファベット、オペレータ、変数を含めることができます.JavaScript式とは異なり、AngularJS式はHTMLに書くことができます.JavaScript式と異なり、AngularJS式では条件判断、ループおよび異常はサポートされていません.JavaScript式とは異なり、AngularJS式はフィルタをサポートします.
data-ng-model

<div ng-app="myApp" ng-controller="myCtrl">
      : <input ng-model="name">
div>
<script>
var app = angular.module('myApp', []);
 app.controller('myCtrl', function($scope) {
    $scope.name = "John Doe";
});
script>

 
転載先:https://www.cnblogs.com/riposa/p/5217060.html