欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

angular常见指令之ng-switch应用

程序员文章站 2022-07-12 10:20:02
...

#与其他语言 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>

转载于:https://my.oschina.net/shuaihong/blog/1540625