您的位置：首页 > Web前端 > AngularJS

AngularJS ng-model directive

2016-04-03 21:28 375 查看

with the ng-model directive youan bind the value of an input field
to a varible

TWO_WAT binding

1.by script

Example

<div ng-app="myApp" ng-controller="myCtrl">

Name: <input ng-model="name">
</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

$scope.name = "John Doe";

});
</script>
Try it Yourself »
2. by expresson

Example

<div ng-app="myApp" ng-controller="myCtrl">

Name: <input ng-model="name">

<h1>You entered: {{name}}</h1>
</div>

Try it Yourself »

Validae User Input:

Example

<form ng-app="" name="myForm" ng-init="myText
= 'post@myweb.com'">

    Email:

    <input type="email" name="myAddress" ng-model="myText"required>

    <h1>Status</h1>

    {{myForm.myAddress.$valid}}

    {{myForm.myAddress.$dirty}}

    {{myForm.myAddress.$touched}}
</form>

Try it Yourself »
Application Status:

ng-empty
ng-not-empty
ng-touched
ng-untouched
ng-valid
ng-invalid
ng-dirty
ng-pending
ng-pristine

Example

<form ng-app="" name="myForm">

    Email:

    <input type="email" name="myAddress" ng-model="text">

    <span ng-show="myForm.myAddress.$error.email">Not
a valid e-mail address</span>
</form>

Try it Yourself »

The ng-model directive provide CSS classes for HTML elements,
depending on their status

Example

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航