각도 컨트롤러 통신의 4가지 방법에 대한 간략한 설명

이 글에서는 컨트롤러 통신의 angular 4가지 방법을 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

【관련 추천: "angular Tutorial"】

먼저 Angular 컨트롤러 통신의 4가지 방법을 요약해 보겠습니다.

• 범위 상속.

• $scope를 통해 이벤트를 방송하세요.

• 이벤트 이미터 모듈.

• 서비스.

1. 범위 상속

하위 범위는 상위 범위에 선언된 변수 및 함수에 액세스할 수 있습니다.

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

2. $scope

$emit 호출을 통한 브로드캐스트 이벤트는 범위를 확장할 수 있고 $broadcast는 하위 범위로 전파되며 $on은 청취자를 등록할 수 있습니다.

<div>
	<div>
	
	</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. 이벤트 이미터 모듈 event-emitter

event-emitter 모듈은 3가지 주요 차이점이 있습니다.

• event-emitter는 범위에 독립적이므로 다음에서 사용하는 것이 이상적입니다. 범위에 액세스할 수 없는 서비스.

• 사용될 함수의 이름은 .on(), .emit()입니다.

• 해당하는 $broadcast() 함수가 없습니다.

<script></script>
<script></script>
<script>
	var app = angular.module(&#39;app&#39;, []);
 
	app.factory(&#39;userService&#39;, function ($timeout, $window) {
		var emitter = $window.emitter();
		var user = {};
 
		//模拟http错误
		$timeout(function () {
			user.emit(&#39;error&#39;, &#39;Could not connect to server&#39;);
		}, 1000);
 
		return user;
	});
 
	app.factory(&#39;profileService&#39;, function (userService) {
		var ret = {
			user: userService,
		};
 
		userService.on(&#39;error&#39;, function () {
			console.log(&#39;get error&#39;);
		});
 
		return ret;
	});
</script>

4. 가장 일반적으로 사용되는 통신은 service입니다.

서비스는 싱글톤이므로 모든 구성 요소에서 서비스 값을 변경하면 다른 구성 요소에 영향을 미치게 됩니다. 서비스를 다음과 같이 나열하면 됩니다. 위의 코드에 표시된 대로 dependency.

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 교육을 방문하세요! !

위 내용은 각도 컨트롤러 통신의 4가지 방법에 대한 간략한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!