模型数据（Data）
模型是从AngularJS作用域对象的属性引申的。模型中的数据可能是Javascript对象、数组或基本类型，这都不重要，重要的是，他们都属于AngularJS作用域对象。
AngularJS通过作用域来保持数据模型与视图界面UI的双向同步。一旦模型状态发生改变，AngularJS会立即刷新反映在视图界面中，反之亦然。
示例：
html
<!DOCTYPE html>
<html>
<head>
<script src="http://cdn.bootcss.com/angular.js/1.4.0-rc.1/angular.min.js"></script>
<meta charset="utf-8">
<title>AnjularJs</title>
</head>
<body ng-app="page" ng-controller="phoneList">
<!--ng-model start-->
<div class="contianer">
<h3>输入：{{query}}</h3>
搜索：<input type="text" ng-model="query"></br>
选择1：<select ng-model="query1" ng-options="v.val as v.name for v in option">
<option value="">请选择</option>
</select></br>
选择2：<select ng-model="query2">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select></br>
排序：<select ng-model="orderProp">
<option value="name" selected>name</option>
<option value="age">age</option>
</select>
<ul class="phones">
<li ng-repeat="phone in phones|filter:query|filter:query1|orderBy:orderProp">
{{phone.name}}
<p>
{{phone.snippet}}
</p>
</li>
</ul>
</div>
<!--ng-model end-->
<!--ng-options start-->
<div class="opt">
基本：<select ng-model="selectLunch" ng-options="lunch.name for lunch in lunches">
<option value="">请选择</option>
</select></br>
自定：<select ng-model="selectLunch" ng-options="(lunch.name + ' (' + lunch.side_dish + ')') for lunch in lunches">
<option value="">请选择</option>
</select></br>
自定value：<select ng-model="selectLunch" ng-options="lunch.name for lunch in lunches track by lunch.price">
<option value="">请选择</option>
</select>
<p>{{selectLunch}}</p>
加入optgroup 分类：<select ng-model="selectLunch" ng-options="lunch.name group by lunch.category for lunch in lunches track by lunch.price">
<option value="">请选择</option>
</select>
<p>{{selectLunch}}</p>
<!--ng-options end-->
</div>
</body>
</html>
css
div{border:3px solid #ccc;padding:10px;margin-top:10px;}
h3{color:#888;padding:;margin:0 0 5px 0;}
p{color:red}javascript
var app = angular.module('page', []);
app.controller('phoneList', function($scope) {
//模型变量
$scope.phones = [{"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S.",
"age": 0},
{"name": "Motorola XOOM™ with Wi-Fi",
"snippet": "The Next, Next Generation tablet.",
"age": 1},
{"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation tablet.",
"age": 2}];
$scope.orderProp = "age";
$scope.option = [
{"val":0,"name":"－0－"},
{"val":1,"name":"－1－"},
{"val":2,"name":"－2－"}
];
$scope.query1 = "";
$scope.query2 = "0";
//select分组
$scope.lunches = [
{
name: 'Hamburger',
side_dish: 'Corn Soup',
category: 'Food',
price: 50
},
{
name: 'Rice',
side_dish: 'Egg',
category: 'Food',
price: 80
},
{
name: 'Pork',
side_dish: 'Black Tea',
category: 'Food',
price: 100
},
{
name: 'Shit',
side_dish: 'Dog',
category: 'Garbage',
price: 10
}
];
});