Maison > Article > interface Web > Injection de dépendances AngularJS (exemple 1)

Injection de dépendances AngularJS (exemple 1)

黄舟original: 2017-02-18 13:33:111009parcourir

1. Contexte du problème

Une injection de dépendance unique à AngularJS Lorsqu'un objet est créé, il doit dépendre d'un autre objet.

2. Code source de mise en œuvre

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>AngularJS之依赖注入（实例一）</title>
		<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<style>
			body,html{
				font-family: "微软雅黑";
				font-size: 12px;
				font-feature-settings: on;
			}
			.showContent{
				width: 200px;
				padding: 10px;
				margin: 10px;
				border: 1px dashed #2AABD2;
			}
		</style>
		<script>
			var app = angular.module("reApp",[]);
			app.config(function($controllerProvider){
				$controllerProvider.register("reCon",["$scope",function($scope){
					$scope.content = "";
					$scope.clickShow = function(){
						$scope.content = "showContent";
						$scope.showContent = "依赖注入";
					};
				}]);
			});
		</script>
	</head>
	<body ng-app="reApp">
		<p ng-controller="reCon">
			<button type="button" ng-click="clickShow();">依赖注入</button><br><br>
			<label class="{{content}}">{{showContent}}</label>
		</p>
	</body>
</html>

3. Résultats de la mise en œuvre

(1) Initialisation

Injection de dépendances AngularJS (exemple 1)

(2) En cliquant sur le bouton

Injection de dépendances AngularJS (exemple 1)

Ce qui précède est le injection de dépendances d'AngularJS (Exemple 1) Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Boîte de dialogue AngularJSArticle suivant：Boîte de dialogue AngularJS

Articles Liés

Voir plus