ng-model、ng-bind、ng-value使用区别
丁勇
1、ng-model : 是双向数据绑定，改变页面上ng-model模块的值，也会对$scope中对应的值起作用;
ng-bind : 是单向数据绑定，页面上改变并不会对$scope中内容起到作用;
ng-value : 作用类似于 html中value的作用;
2、ng-model : 可以定义在<select> <input>等标签内，显示值
ng-bind : 是覆盖html元素的内容，所以放在<input>中不会显示值，查看覆盖后的代码是<input>xxxx</input>，所以不会显示值，
可以放在<span>等标签中
3、下边的一段代码可以看到ng-model与ng-value结合使用的效果，类比于原生radio使用方法，ng-model类似于name的作用，ng-value是赋值给ng-model
<!doctype html>
<html lang="en" ng-app="hd">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="../org/angular.min.js"></script>
</head>
<style>
.ng-cloak{
display: none;
}
</style>
<body ng-cloak class="ng-cloak">
<div ng-controller="list">
<input type="text" ng-model="changeName1">{{changeName1}}
<br>
<span ng-bind="changeName2"></span>
<br>
<input type="text" ng-value="changeName1">
<hr>
<span>网站控制:</span>
<input type="radio" ng-model="status" ng-value="1">开启
<input type="radio" ng-model="status" ng-value="0">关闭
<br>
{{status}}
<br>
<texta ng-show="status==0">
展示关闭的内容
</texta>
<br>
<input type="radio" value="1" name="sex">男
<input type="radio" value="0" name="sex">女
</div>
<script>
var hd = angular.module('hd',[]);
hd.controller('list',['$scope',function ($scope) {
$scope.changeName1 = "model";
$scope.changeName2 = "bind";
$scope.status=1;
}]);
</script>
</body>
</html>
类似资料：