Angular学习记录-显示与隐藏
在学习之前,首先声明以下,暂时日后更新的AngularJS学习记录系列的文章,都将会是结合本人正在看的《AngularJS 实战》书籍里的内容进行分享和个人观点及评价。
简单粗暴直接看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ng-repeat</title>
<script src="../js/angular.min.js"></script>
<style>
body{font-size:12px;}
ul{list-style-type: none;margin:0;padding:0;}
div{margin:8px 0;}
</style>
</head>
<body ng-app="app" ng-controller="myCtr">
<div>
<div ng-show="{{isShow}}">LamHo</div>
<div ng-hide="{{isHide}}">LamHo@163.com</div>
<ul ng-switch on="{{switch}}">
<li ng-switch-when="1">LamHo</li><!--$scope.switch == 1-->
<li ng-switch-when="2">LamHo@163.com</li><!--$scope.switch == 2-->
<li ng-switch-default>更多</li><!--$scope.switch != 1 && $scope.switch != 2-->
</ul>
</div>
<script>
var app = angular.module('app',[]);
app.controller('myCtr',['$scope',function($scope){
$scope.isShow = true;
$scope.isHide = false;
$scope.switch = 3;
}])
</script>
</body>
</html>
由此可以看到控制显示和隐藏的方法,当然控制显示和隐藏的方式还可以用三目运算进行判断