Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Home > Web Front-end > JS Tutorial > body text

AngularJS dialog box

黄舟

Release： 2017-02-18 13:28:43

Original

1135 people have browsed it

1. Problem background

AngularJS creates a dialog box and uses $window to implement the dialog box

2. Implementation source code

<!DOCTYPE html>
<html ng-app="winApp">
	<head>
		<meta charset="UTF-8">
		<title>AngularJS之对话框</title>
		<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<script>
			var app = angular.module("winApp",[]);
			app.factory("$show",function($window){
				return{
					show:function(content){
						$window.alert(content);
					}
				};
			});
			
			var control = function($scope,$show){
				$scope.tanClick = function(message){
					$show.show(message);
				}
			}
			
			app.controller("winCon",control);
		</script>
	</head>
	<body>
		<p ng-controller="winCon">
			<button ng-click="tanClick(&#39;对话框！&#39;)">对话框</button>
		</p>
	</body>
</html>

Copy after login

3. Implementation result

AngularJS dialog box

The above is the content of the AngularJS dialog box. Please pay attention to more related content. PHP Chinese website (www.php.cn)!

Related labels：

angularjs dialog box

source：php.cn

Previous article：zTree click text to check the checkbox Next article：AngularJS Dependency Injection (Example 1)

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn