2016-06-09 7 views
0

У меня есть 2 просмотра, которые имеют один и тот же контроллер. В каждом из этих представлений я использовал разрешение на получение некоторой даты перед ее отображением. Затем я добавляю его в свой контроллер (поэтому я добавляю две зависимости для каждого представления).Несколько просмотров, несколько разрешений, но для одного контроллера в AngularJS

Но проблема в том, что когда я перехожу от представления к другому, консоль отображает ошибку, потому что она не видит зависимости от другого представления. Это моя конфигурация маршрута

.state('ambassade', { 
 
       url: '/mot_ambassadeur', 
 
       views: { 
 
        "@": { 
 
         templateUrl: "pages/GestionAmbassade/mot_ambassadeur.html", 
 
         controller: "GestionAmbassadeController", 
 
         resolve: { 
 
          informationsAmbassade: function(GestionAmbassadeService) { 
 
           return GestionAmbassadeService.getMotAmbassadeurService(); 
 
          } 
 
         } 
 
        } 
 
       } 
 
      }) 
 
      .state('personnel', { 
 
       url: '/personnel', 
 
       views: { 
 
        "@": { 
 
         templateUrl: "pages/GestionAmbassade/personnel.html", 
 
         controller: "GestionAmbassadeController", 
 
         resolve: { 
 
          personnelAmbassade: function(GestionAmbassadeService) { 
 
           return GestionAmbassadeService.getPersonnelService(); 
 
          } 
 
         } 
 
        } 
 
       } 
 
      })

Это мой контроллер, на 2 инъекции informationsAmbassade и personnelAmbassade:

.controller('GestionAmbassadeController', function ($rootScope, $scope, $injector, $sce, 
 
                 informationsAmbassade, 
 
                 personnelAmbassade) { 
 

 
     $scope.getMotAmbassadeur = function() { 
 
      if (localStorage.getItem("lang") == "fr") { 
 
       $scope.motAmbassadeur = $sce.trustAsHtml(informationsAmbassade.contents[0].translation.fr_fr.contenu); 
 
       $scope.load = true; 
 
      } 
 
      $scope.photoAmbassadeur = informationsAmbassade.contents[0].content.path; 
 

 
     }; 
 

 
     $scope.getPersonnel = function() { 
 
      $scope.Personnels = []; 
 
      if (localStorage.getItem("lang") == "fr") { 
 
       for (var i = 0; i < personnelAmbassade.contents.length; i++) { 
 
        //if (angular.isDefined(res.contents[i].type) && res.contents[i].type.nom == 'personnel') 
 
        $scope.Personnels.push({ 
 
         nom: $sce.trustAsHtml(personnelAmbassade.contents[i].translation.fr_fr.contenu), 
 
         poste: $sce.trustAsHtml(personnelAmbassade.contents[i].translation.fr_fr.titre) 
 
        }); 
 
       } 
 
       $scope.load = true; 
 
      } 
 
     };

Так что, когда я иду в AMBASSADE маршрут не видит индивидуальную инъекцию n и наоборот. Я знаю, что могу использовать два разрешения для каждого состояния, но это то, чего я избегаю для производительности. Может ли кто-нибудь помочь мне разобраться в этой «проблеме».

ответ

0

Вы должны создать верхнее абстрактное состояние для решения ваших данных, тогда вы обязательно загрузите правильные зависимости (оба из них), когда находитесь в своем контроллере.

.state('app', { 
    abstract:true, 
    template:'<div ui-view></div>', 
    resolve:{ 
     informationsAmbassade: function(GestionAmbassadeService) { 
      return GestionAmbassadeService.getMotAmbassadeurService(); 
     }, 
     personnelAmbassade: function(GestionAmbassadeService) { 
      return GestionAmbassadeService.getPersonnelService(); 
     } 
    } 
} 
.state('app.ambassade', { 
    url: '/mot_ambassadeur', 
    views: { 
     "@": { 
      templateUrl: "pages/GestionAmbassade/mot_ambassadeur.html", 
      controller: "GestionAmbassadeController" 
      } 
     } 
    } 
}) 
.state('app.personnel', { 
    url: '/personnel', 
    views: { 
     "@": { 
      templateUrl: "pages/GestionAmbassade/personnel.html", 
      controller: "GestionAmbassadeController" 
     } 
    } 
}) 
1

Вы должны увидеть впрыск в контроллер как интерфейс из более ориентированных на объект языков.

Так называйте это чем-то вроде сущ. Службы и сделайте так, чтобы обе службы, которые вы пытались ввести, имели метод с тем же именем, который вы можете вызывать с контроллера. (Или в вашем случае массивов 'содержимое')

.controller('GestionAmbassadeController', function ($rootScope, $scope, $injector, $sce,entityService) { 

Тогда в решимостью положить:

entityService: return GestionAmbassadeService.getPersonnelService(); 

или

entityService: return GestionAmbassadeService.getMotAmbassadeurService(); 

В зависимости от экземпляра контроллера.

Редактировать: Не похоже, что хорошая идея иметь один и тот же контроллер для обоих состояний в этом случае. В любом случае вы сможете использовать только одну из двух заданных функций. Поэтому было бы просто иметь отдельные контроллеры.

+0

Да, я думал об этом, но разве это не проблема, когда у меня слишком много страниц? Не будет слишком много контроллеров быть немного тяжелым – lakhassane

+0

В дополнение к вашему ответу, при использовании этого метода, я думаю, мы также должны проверить, из какого состояния пользователь приходит. – lakhassane

+1

Более мелкие контроллеры должны быть менее тяжелыми, поскольку за один раз будет инициализировано меньшее количество элементов. (Все эти вещи лениво инициализируются при необходимости .. или, по крайней мере, должны быть). И когда вы начинаете тестирование, где пользователь приходит из контроллера, вы должны обязательно разделить их. –

1

Спасибо, ребята. Оба ответа решили проблему (я попробовал их: D). Но я думаю, что первый из них более подходит, потому что во втором, когда у меня слишком много страниц для одного и того же контроллера, он будет немного медленнее первого ответа.

Но все еще работает. Спасибо.

изменить: когда я сказал, что первый, о котором я говорил, ответил Боб Бринкс. Он перемещается вниз, когда редактирует его.