一、布尔属性指令:
ng-disabled:就是ng-disabled=true-->就指向不可用
<!doctype html>
<html ng-app="">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head>
<body>
<input type="text" ng-model="someProperty" placeholder="Type to Enable">
<button ng-model="button" ng-disabled="!someProperty">A Button</button>
</body>
</html>
ng-checked:如上
<!doctype html>
<html ng-app="">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
</head>
<body>
<label>someProperty = {{someProperty}}</label>
<input type="checkbox"
ng-checked="someProperty"
ng-init="someProperty = true"
ng-model="someProperty">
</body>
</html>
ng-readonly:如上,这个就跟上面一样的用法咯
ng-selected:如上
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head>
<body>
<label>Select Two Fish:</label>
<input type="checkbox"
ng-model="isTwoFish"><br/>
<select>
<option>One Fish</option>
<option ng-selected="isTwoFish">Two Fish</option>
</select>
<script>
angular.module('myApp', [])
</script>
</body>
</html>
二、类布尔属性:
ng-href:
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head>
<body>
<!-- Always use ng-href when href includes an {{ expression }} -->
<a ng-href="{{myHref}}">I'm feeling lucky, when I load</a>
<!-- href may not load before user clicks -->
<a href="{{myHref}}">I'm feeling 404</a>
<script>
angular.module('myApp', [])
.run(function($rootScope, $timeout) {
$timeout(function() {
$rootScope.myHref = 'http://google.com';
}, 2000);
})
</script>
</body>
</html>
你运行这段代码就会发现,ng-href会执行$timeout,但是href不会。
ng-src:这个一样的道理
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head>
<body>
<h1>Wrong Way</h1>
<img src="{{imgSrc}}" />
<h1>Right way</h1>
<img ng-src="{{imgSrc}}" />
<script>
angular.module('myApp', [])
.run(function($rootScope, $timeout) {
$timeout(function() {
$rootScope.imgSrc = 'https://www.google.com/images/srpr/logo11w.png';
}, 5000);
});
</script>
</body>
</html>
这个src执行会报错,不行你试试
布尔属性,我觉得原型就是数据的双向绑定呢
更多专业前端知识,请上 【猿2048】www.mk2048.com