Heim >Web-Frontend >js-Tutorial >Eine kurze Diskussion über vier Möglichkeiten der Winkelsteuerungskommunikation

Eine kurze Diskussion über vier Möglichkeiten der Winkelsteuerungskommunikation

青灯夜游
青灯夜游nach vorne
2021-05-14 11:07:592155Durchsuche

In diesem Artikel werden Ihnen eckige4 Arten der Controller-Kommunikation vorgestellt. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Eine kurze Diskussion über vier Möglichkeiten der Winkelsteuerungskommunikation

【Verwandte Empfehlung: „Angular-Tutorial“】

Lassen Sie uns zunächst die 4 Arten der Angular-Controller-Kommunikation zusammenfassen:

  • Scope-Vererbung.

  • Ereignisse über $scope übertragen.

  • Event-Emitter-Modul.

  • Service.

1. Bereichsvererbung

Unterbereiche können auf Variablen und Funktionen zugreifen, die in ihren Vorgängerbereichen deklariert sind.

<div ng-controller="Controller1">
	<div ng-controller="Controller2">
		this prints '42':{{answer}}
	</div>
</div>
m.controller('Controller1', function ($scope) {
	$scope.answer = 42;
});
m.controller('Controller2', function ($scope) {
	console.log($scope.answer);
});

2. Broadcast-Ereignisse über $scope

$emit-Aufrufe können den Bereich vergrößern, $broadcast wird an untergeordnete Bereiche weitergegeben und $on kann Listener registrieren.

<div ng-controller="Controller1">
	<div ng-controller="Controller2">
	
	</div>
</div>
m.controller('Controller1', function ($scope) {
	$scope.$on('ping', function (){
		console.log('pong');
	});
	$scope.$broadcast('broadcast');
});
m.controller('Controller2', function ($scope) {
	$scope.$emit('ping');
	$scope.$on('broadcast', function (){
		console.log('broadcast');
	});
});

3. Das Event-Emitter-Modul funktioniert ähnlich wie der Scope-Emitter:

Event-Emitter ist unabhängig vom Bereich und daher ideal für die Verwendung Dienste, die keinen Zugriff auf den Bereich haben.
  • Die Funktionen, die verwendet werden, heißen .on(), .emit().
  • Es gibt keine entsprechende $broadcast()-Funktion.
  • <script type="text/javascript" src="angular.js"></script>
    <script type="text/javascript" src="event-emitter.js"></script>
    <script type="text/javascript">
    	var app = angular.module('app', []);
     
    	app.factory('userService', function ($timeout, $window) {
    		var emitter = $window.emitter();
    		var user = {};
     
    		//模拟http错误
    		$timeout(function () {
    			user.emit('error', 'Could not connect to server');
    		}, 1000);
     
    		return user;
    	});
     
    	app.factory('profileService', function (userService) {
    		var ret = {
    			user: userService,
    		};
     
    		userService.on('error', function () {
    			console.log('get error');
    		});
     
    		return ret;
    	});
    </script>
  • 4. Die am häufigsten verwendete Kommunikation ist der Dienst

Da es sich bei dem Dienst um einen Singleton handelt, wirkt sich eine Änderung des Werts des Dienstes in einer beliebigen Komponente auf andere Komponenten aus. Die Verwendung ist sehr einfach. Listen Sie den Dienst einfach als auf eine Abhängigkeit, wie im obigen Code gezeigt.

Weitere Kenntnisse zum Thema Programmierung finden Sie unter:

Programmierlehre

! !

Das obige ist der detaillierte Inhalt vonEine kurze Diskussion über vier Möglichkeiten der Winkelsteuerungskommunikation. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen