2014-10-20 2 views
0

컨트롤러 (예 : https://github.com/angular-ui/ui-router/wiki)를 활성화하기 전에 데이터를로드하는 데 "해결 방법"을 사용하는 방법에 대한 여러 가지 예가 있지만이를 MeanJS 아키텍처에 통합하는 방법을 이해할 수 없습니다. 은 "해결"옵션 mymodule.client.routes.js 및/또는 구조하는 방법/주입 사전로드 된 서비스에 추가 할 필요가있는 경우 내가 확실하지 오전 Delaying AngularJS route change until model loaded to prevent flickermeanjs에서 해결 사용하기

: 여기

인기 질문/답변입니다 컨트롤러 인수에 넣습니다.

MeanJS에 맞게 예제를 변형하는 방법에 대한 조언이 있으십니까? 업데이트 - -

내가보기에서 데이터 NG 컨트롤러 = "MyController에"를 제거하고 대신 mymodule.client에 직접 컨트롤러를 설정하려고 각 버전 1.2.26

를 사용

. routes.js를 "해결"옵션 옆에 추가하십시오. 이는 해결 된 객체를 컨트롤러에 주입하는 것을 수정하는 것으로 보이지만, MeanJS 아키텍처를 변경합니다. 이것이 올바른 방법일까요?

답변

0

보기 내부에 컨트롤러를 지정하지 마십시오. 대신, https://github.com/angular-ui/ui-router/wiki

과 같이 경로를 정의 할 때 컨트롤러를 할당하십시오. /public/modules/articles/config/articles.client.routes.js :

보기 :

내가 (다른 유래의 답변에 따라) 알아 낸 무엇
angular.module('articles').config(['$stateProvider', 
    function($stateProvider) { 
     // Articles state routing 
     $stateProvider. 
     state('listArticles', { 
      url: '/articles', 
      templateUrl: 'modules/articles/views/list-articles.client.view.html', 
      controller: 'ArticlesController', 
      resolve: { 
       UnitTypes: function($http){ 
        return $http({method: 'GET', url: '/unit-types'}); 
       }, 
      }, 
     } 
    } 
]); 
1

은이 같은 설정 일을하는 :

<section data-ng-controller="ArticlesController"> 
    <!-- accessing article variable resolved in routes stateProvider --> 
</section> 

컨트롤러 :

'use strict'; 

angular.module('articles').controller('ArticlesController', ['$scope', 
    function($scope) { 
     /* 
     * Whatever methods/variables/binds etc. you need. 
     * Also you can access $scope.article because it is already resolved 
     */ 
    } 
]); 

경로 (즉, 요점) :

$stateProvider. 
    state('article', { 
     url: '/v/:path', 
     templateUrl: 'modules/articles/views/article.client.view.html', 
     resolve: { 
      article: function($stateParams, Articles) { 
       return Article.get({ 
        path: $stateParams.path 
       }).$promise; 
      } 
     }, 
     controller: function($scope, article) { 
      $scope.article = article; 
     } 
    }). 

그래서 당신은 article 객체를 해결 stateProvider controller을 통해 $ 범위에 저장하고이 같은 범위를 공유하기 때문에 당신은보기와 ArticlesController에서 모두 사용할 수 있습니다.

희망이 있으면 도움이 될 것입니다. (현재 MEANjs 진화 상태에서 가능한 최선의 해결책이 아니길 바랍니다.)

0

오늘 아침에 문제가 발생했습니다.

핵심 라우팅 구성 (core.client.routes.JS)

가 여기 내 핵심 설정 기능은 내 주요 경로에 대한의 :

$stateProvider.state('home', { 
       url: '/', 
       templateUrl: 'templates/main.client.view.html', 
       controller:'MainCtrl', 
       resolve: { 
     initialData: function(mainControllerInitialData) { 
      return mainControllerInitialData(); 
     } 
    } 
     }); 

* 메모 :이 서비스가 낙타 표기법에 이름을 지정하고 PascalCase하지 있는지 확인; 그렇지 않으면 taskrunner (내가 쭉 마시는를 사용하고 있습니다)에서 기본 작업 (들) 약속으로 해결 방법에 반환됩니다 남았습니다

서비스 (mainControllerInitialData.service.js를) 여기

이있어 갈 것입니다 서비스 자체 :

'use strict'; 
    var ser = angular.module('mean') 
    .factory('mainControllerInitialData', function(queryPrismicDocument, $q) { 
     return function() { 


      var qpd = queryPrismicDocument; 

      var restaurantMenu = qpd.query('[[:d = at(document.type, "restaurantMenu")]]', 'restaurantMenu'); 

      console.log('i am MainControllerInitialData.service.js'); 




      return $q.all([restaurantMenu]).then(function(results){ 
       return { 
        restaurantMenu: results[0] 
       }; 
      }); 
     }; 
    }); 

메인 컨트롤러 (main.controller.js) 여기

는 경로 C에 나와있는 컨트롤러의 onfiguration ("MainCtrl") : 해결 방법을 통해 값을 주입하고 있습니다.

'use strict'; 

angular.module('core') 
    .controller('MainCtrl', ['$scope','initialData',function ($scope, initialData) { 
    console.log('i am MainCtrl...'); 

    console.log('i am at the top of the pack'); 
    console.log('i am initialData:'); 
    console.log(initialData); 

    $scope.restaurantMenu = initialData.restaurantMenu[0]; 




    }]);