Как изменить угловые данные вне контроллера?

Question

У меня есть главная страница, состоящая только из двух частей: заголовок навигации и динамический контент.

index.html:

<div ng-controller='MainCtrl'> 
    <li ng-repeat="nav in navs"> 
     <a href="#{{nav.url}}">{{nav.name}}</a> 
    </li> 
</div> 
<div ng-view></div> <!-- replaced by ngRoute --> 

Навигационная достигается следующим образом:

app.config(function($routeProvider, $locationProvider) { 
    $routeProvider.when("/test", { 
     templateUrl : "templates/test.html", 
     controller : "testController" 
    }); 
}); 

заголовок ссылки должны быть предоставлены бэкэндом по запросу каждого веб-сервиса. Вопрос: как я могу вызвать следующую функцию init из другого контроллера (тот, который получает ответ get)? I lateron хочет вызвать этот метод из разных контроллеров.

app.controller('MainCtrl', ['$scope', function($scope) { 
    this.init = function(data) { 
     $scope.navs = data; 
    } 
}]); 

Я попытался следующие, которые не работают:

test.html:

<div> 
    <h1>some stuff provided by testController.js</h1> 
</div> 

testController.js:

angular.module('test').controller('testController', ['$scope', '$http', '$controller', function($scope, $http, $controller) { 
    $http.get(url) 
     .success(function(data) { 
      $controller('MainCtrl').init(data.mynavigation); //assume navigations exists 

      //process content in data 
     }); 
}]); 

Результат:

Error: [$injector:unpr] http://errors.angularjs.org/1.4.3/$injector/unpr?p0=%24scopeProvider%20%3C-%20%24scope%20%3C-%20MainCtrl 

Answer 1

Если вы хотите запустить функцию инициализации whitin инициализации вашего контроллера, просто позвоните this.init() в ваш контроллер.

Чтобы получить наследование с наследованием, рассмотрите возможность наследования областей. В документах есть примеры: https://docs.angularjs.org/guide/controller

Если вы хотите повторно использовать код вызова/ответа, вы можете подумать о создании сервиса и введении его в качестве зависимости в своем контроллере по мере необходимости. Создайте сервис, который возвращает обещание и обрабатывает это обещание внутри контроллеров.

Обратитесь к https://docs.angularjs.org/api/ng/service/ $ q, чтобы понять, как работать с угловыми обещаниями.

Для получения дополнительных сведений об услугах обращайтесь к AngularJS: Service vs provider vs factory.

Answer 2

Вместо того, чтобы устанавливать данные с помощью инициализации, я рекомендую вводить службу в контроллер объема $, поэтому вам не нужно вызывать функцию в контроллере, а просто изменять данные своей службы.

Что-то вроде этого:

app.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) { 
    this.navs = myService; 
}]); 

HTML:

<div ng-controller='MainCtrl'> 
    <li ng-repeat="nav.data in navs"> 
     <a href="#{{nav.url}}">{{nav.name}}</a> 
    </li> 
</div> 

Тогда ваша служба:

app.factory('myService',function() { 
    var myService = { 
     data: [], 
     setData(data): function(data) { 
      this.data = data; 
     } 
    } 
    return myService; 
}); 

Это просто ilustrate: MYSERVICE тот же объект во всех ваше приложение, если вы измените myService.data, каждый контроллер, который внедряет эту службу, будет использовать одни и те же данные.

Таким образом, вы добавляете триггер в другой контроллер для обновления этой службы. Этот метод используется для обмена данными между директивами.