Une brève discussion sur la relation entre les contrôleurs, les services et les instructions dans Angular

Cet article vous présentera la relation entre les contrôleurs angulaires, les services et les instructions. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

[Recommandation associée : "tutoriel angulaire"]

Dans l'ensemble, la relation entre ces trois composants est la suivante :

• Le service est responsable de la récupération et du stockage des données du serveur distant.
• Les contrôleurs construits sur les services fourniront des données et des fonctionnalités à la hiérarchie de portée d'Angular.
• Les directives construites sur les services et les contrôleurs interagiront directement avec les éléments du modèle objet de document (DOM).

Étant donné que le contrôleur n'est pas enregistré auprès de l'injecteur de dépendances, le contrôleur et le service ne peuvent pas répertorier le contrôleur comme dépendance.

<div ng-controller="MyController"></div>

Chaque ng-controller sera instancié une fois, et le service ne sera instancié qu'une seule fois, c'est-à-dire que le service est un singleton.

Les contrôleurs peuvent répertorier les objets locaux en tant que dépendances, tels que $scope, mais les services ne peuvent pas répertorier les objets locaux en tant que dépendances.

var m = angular.module('myModule');
 
m.factory('myService', function() {
    return { answer: 42 };
});
 
m.controller('MyController', function(myService) {
    //使用myService
});
 
m.controller('MyController2', function(MyController) {
    //错误：使用控制器注册
});
 
m.factory('myService2', function(MyController) {
    //错误：使用控制器注册
});

C'est pourquoi en angulaire c'est le contrôleur qui expose les données et fonctions JavaScript au HTML au lieu du service : le contrôleur a accès à $scope. Les directives

peuvent avoir un contrôleur associé, qui peut lister les services comme dépendances. Mais les contrôleurs et les services ne peuvent pas répertorier les directives comme dépendances. La directive

m.factory('myService', function($scope) {
    //错误：$scope未使用依赖注入器进行注册
});

peut également avoir un attribut require, qui est utilisé pour garantir que la portée de la directive doit toujours être un descendant de la portée d'une autre directive. L'option de directive

angular.module('stockDogApp')
  .directive('stockTable', function() {
  	return {
  		template: 'Views/templates/stock-table.html',
  		restrict: 'E',
  		scope: {
  			watchlist: '='
  		},
  		controller: function ($scope) {
  			//...
  		}
  	}
  });

require nécessite que la portée de la directive stockRow soit un descendant de la portée de la directive stockTable et puisse accéder au contrôleur de la directive stockTable instanciée, qui est le quatrième paramètre de la fonction de lien . Si les deux directives doivent être utilisées ensemble, l'option de directive require est le bon outil pour le travail.

Remarque : veuillez vous référer à "Programmation avancée avec AngularJS" à titre de mémo uniquement.

Pour plus de connaissances liées à la programmation, veuillez visiter : Introduction à la programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!