Как избежать использования `$ parent. $ Parent. $ Parent` во вложенных областях - PullRequest
Новая
       11

Как избежать использования `$ parent. $ Parent. $ Parent` во вложенных областях

0 голосов
/ 11 мая 2018

Как узнать имя родительского контроллера в цепочке контроллеров Angular?

Я новичок в Angular, поэтому у меня есть один базовый вопрос.

Предположим, в Angular у меня естьЦепочка контроллера, как показано ниже. 

<div ng-controller="parentController">
  ... something in the parent element
  <div ng-controller="childController">
     ... something in the child element
  </div>
</div>

Можно ли написать код в дочернем элементе, чтобы я мог знать имя родительского контроллера в выходных данных (в этом случае выходные данные должны быть 'parentController')?

Мне это нужно, потому что у меня слишком большой проект, и я хочу знать родителя каждого контроллера, потому что кто-то написал код, подобный 

googleOAuth= $scope.$parent.$parent.$parent.$parent.status.googleOAuth

, и я не могу этого понятьхочу знать родителя каждого $ scope.

Ответы [ 2 ]

0 голосов
/ 27 июня 2018

При подходе используется синтаксис «контроллер как»: 

<div ng-controller="parentController as top">
     <!-- ... something in the parent element -->
  <div ng-controller="childController">
     <!-- ... something in the child element -->
     {{top.status.googleOAuth}}
  </div>
</div>

Для этого требуется, чтобы контроллер записывался с использованием контекста this вместо $scope.

Другой подход заключается в использовании свойства объекта в родительской области: 

app.controller("parentController", function($scope) {
    $scope.top = {status: {} };
    $scope.top.status.googleOAuth = value;
});

<div ng-controller="parentController">
     <!-- ... something in the parent element -->
  <div ng-controller="childController">
     <!-- ... something in the child element -->
     {{top.status.googleOAuth}}
  </div>
</div>

Поскольку области используют прототипное наследование, свойство top доступно для дочерних областей.

См. Руководство разработчика AngularJS - Иерархии областей действия .

0 голосов
/ 11 мая 2018

Как сказал georgeawg, использование $ parent не является оптимальным, поскольку оно опирается на постоянное количество областей.

Вместо этого вы можете написать сервис для работы с вашим googleOAuth.Затем сервис может быть введен в каждый контроллер и будет функционировать как единый источник правды, потому что сервисы в AngularJS являются единичными.

Например, что-то вроде этого 

angular.module('appModule', [])
    .factory('googleOAuthService', [function() {
        var googleOAuth = {
            // your googleOAuth stuff here
        };

        return {
            get: get,
            set: set,
            stuff: stuff
        }

        function get () {
            return googleOAuth;
        }

        function set (newGoogleOAuth) {
            googleOAuth = newGoogleOAuth;
        }

        function stuff () {
            // Do stuff to googleOAuth
        }
    }])
    .controller('parentController', ['googleOAuthService', function(googleOAuthService) {
        googleOAuthService.stuff();
    }])
    .controller('childController', ['googleOAuthService', function(googleOAuthService) {
        googleOAuthService.stuff();
    }]);

Для получения дополнительной информации см. https://docs.angularjs.org/guide/services

...