angular常见指令之ng-switch应用

发布时间：2020-12-17 08:49:34 所属栏目：安全来源：网络整理

导读：#与其他语言 switch case对比 switch --ng-switch --选择变量 case-ng-switch-when --选择匹配的值示例如下： body ng-app="myApp" ng-controller="demoCtrl"!--匹配上显示匹配不上隐藏--div ng-switch="num"button ng-click="num=1"按钮1/buttonbutton

#与其他语言 switch case对比

switch -->ng-switch --选择变量
case->ng-switch-when --选择匹配的值

示例如下：

<body ng-app="myApp" ng-controller="demoCtrl">
	<!--
		匹配上 显示  匹配不上 隐藏
	-->
	<div ng-switch="num">
		<button ng-click="num=1">按钮1</button>
		<button ng-click="num=2">按钮2</button>
		<button ng-click="num=3">按钮3</button>

		<div ng-switch-when="1">按钮1对应的内容</div>
		<div ng-switch-when="2">按钮2对应的内容</div>
		<div ng-switch-when="3">按钮3对应的内容</div>
	</div>
	
	<script src="node_modules/angular/angular.js"></script>
	<script>
		angular.module('myApp',[])

			.controller('demoCtrl',['$scope',function($scope){

				$scope.num = 1;

			}])
	</script>
</body>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!