ng-show ng-hide

函数控制显示隐藏
<!DOCTYPE html>
<html  lang="en">
	<head>
		<meta charset="UTF-8">
		<title></title>
	<script src="js/jquery-3.1.1.js"></script>
	<script src="js/angular.js"></script>
	<script>
		var app=angular.module("app",[]);
		app.controller("ss",function($scope){
			$scope.a=true;
			$scope.b=function(){
				$scope.a=!$scope.a;
			}
		})
	</script>
	</head>
	<body ng-app="app" ng-controller="ss">
		<div ng-show="a">asdfsdfds</div>
		<span ng-click="b()">点击</span>
	</body>
</html>

表达式控制显示隐藏

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="app">
<head>
	<meta charset="utf-8" />
    <title>show-hide</title>
    <script src="js/angular.js"></script>
    <script>
        var app = angular.module('app', []);
        app.controller('showHideController', function ($scope) {
            $scope.a = function () {
                $scope.animal = '';
            }
        });
    </script>
</head>
<body>
	<input type="" name="" id="" ng-model="animal" placeholder="请输入dog"/><br />
	<span ng-show="animal=='dog'" >it is a dog</span>
</body>
</html>


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> 
</head>
<body>

<form ng-app="" name="myForm">
    Email:
    <input type="email" name="myAddress" ng-model="text">
    <span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span>
</form>

<p>在输入框中输入你的邮箱地址,如果不是一个合法的邮箱地址,会弹出提示信息。</p>

</body>
</html>

猜你喜欢

转载自1035040092.iteye.com/blog/2348077