输出显示<!doctype html>
<html lang="en" ng-app>
<head>
<meta charset="utf-8">
<title>angular</title>
<script src="angular.js"></script>
<script src="index.js"></script>
</head>
<style type="text/css">
.ng-hide {
display:block!important;
position:absolute;
top:-9999px;
left:-9999px;
}
</style>
<body>
<div ng-controller="bookCtrl">
<!-- message为使用简化写法输出内容',message2为使用指令输出,当angular.js没有加载时（网络不好时）,简化输出的方式会在页面显示出表达式,所以不建议在首页使用,而指令表达式则没有问题-->
<p>{{message}}</p>
<p ng-bind="message2"></p>
<!-- ng-show的值为true时显示，false时隐藏 (PS:必须加上ng-hide属性后才会隐藏)-->
<div ng-show="true"> Visible </div>
<div ng-show="false" class="ng-hide"> Invisible </div>
</div>
</body>
</html>index.js
function bookCtrl($scope){
$scope.message ="Hello World";
$scope.message2 = "Hello everyOne";
};绑定事件
html
<div ng-controller="ClickController">
<button ng-click="click()">button</button>
<p>{{message3}}</p>
</div>function ClickController($scope) {
$scope.click = function(){
$scope.message3= "click button";
}
}点击button 输出
click button
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
