angularjs $ 해결 완료 전에 routeProvider 경로가 실행됩니다.

Question

실제 경로 코드를 실행하기 전에 route.resolve 메소드를 실행하고 싶습니다. 불행히도 아래 코드에서 prime()은 호출되지만 비동기 적으로 호출되며 프라임이 완료되기 전에 라우트 코드가 호출됩니다. 루트가로드되기 전에 해결 방법이 완료되었다고 생각 했습니까?

function prime(dc) { 
    return dc.prime(); 
} 

Answer 1

나는 그것을 정의는 다시 위치를 글로벌 컨트롤러에 주요 기능을 제안 routeConfigurator의 범위 안에 프라임

(function() { 
     'use strict'; 

    var app = angular.module('app'); 

    // Collect the routes 
    app.constant('routes', getRoutes()); 

    // Configure the routes and route resolvers 
    app.config(['$routeProvider', 'routes', routeConfigurator]); 

    function routeConfigurator($routeProvider, routes) { 
     routes.forEach(function (r) { 
      setRoute(r.url, r.config); 
     }); 
     $routeProvider.otherwise({ redirectTo: '/' }); 
     function setRoute(url, definition) { 
      definition.resolve = angular.extend(definition.resolve || {}, { prime: prime }); 
      $routeProvider.when(url, definition); 
      return $routeProvider; 
     } 
     prime.$inject = ['datacontext']; 
     function prime(datacontext) { 
      return datacontext.prime(); 
     } 
    } 


    // Define the routes 
    function getRoutes() { 
     return [ 
      { 
       url: '/', 
       config: { 
        templateUrl: 'app/dashboard/dashboard.html', 
        title: 'dashboard', 
        settings: { 
         nav: 1, 
         content: '<i class="fa fa-dashboard"></i> Dashboard' 
        } 
       } 
      }, 
      { 
       url: '/sessions', 
       config: { 
        title: 'sessions', 
        templateUrl: 'app/sessions/sessions.html', 
        settings: { 
         nav: 2, 
         content: '<i class="fa fa-calendar"></i> Sessions' 
        } 
       } 
      }, 
      { 
       url: '/speakers', 
       config: { 
        title: 'speakers', 
        templateUrl: 'app/speakers/speakers.html', 
        settings: { 
         nav: 3, 
         content: '<i class="fa fa-user"></i> Speakers' 
        } 
       } 
      }, 
      { 
       url: '/attendees', 
       config: { 
        title: 'attendees', 
        templateUrl: 'app/attendees/attendees.html', 
        settings: { 
         nav: 4, 
         content: '<i class="fa fa-group"></i> Attendees' 
        } 
       } 
      } 
     ]; 
    } 
})(); 

Answer 2

다음에 주요 변경 시도 :

(function() { 
'use strict'; 

var app = angular.module('app'); 

// Collect the routes 
app.constant('routes', getRoutes()); 

// Configure the routes and route resolvers 
app.config(['$routeProvider', 'routes', routeConfigurator]); 
function routeConfigurator($routeProvider, routes) { 

    routes.forEach(function (r) { 
     setRoute(r.url, r.config) 

    }); 

    $routeProvider.otherwise({ redirectTo: '/' }); 

    function setRoute(url, definition) { 
     //set resolvers for all of the routes 
     //by extending any existing resolvers (or creating a new one) 
     definition.resolve = angular.extend(definition.resolve || {}, { 
      prime: prime 
     }); 


     $routeProvider.when(url, definition); 
     return $routeProvider; 
    } 


} 

prime.$inject = ['datacontext']; 

function prime(dc) { 
    dc.prime(); 
} 


// Define the routes 
function getRoutes() { 
    return [ 
     { 
      url: '/', 
      config: { 
       templateUrl: 'app/dashboard/dashboard.html', 
       title: 'dashboard', 
       settings: { 
        nav: 1, 
        content: '<i class="icon-dashboard"></i> Dashboard' 
       } 
      } 
     }, 
     { 
      url: '/sessions', 
      config: { 
       title: 'admin', 
       templateUrl: 'app/sessions/sessions.html', 
       settings: { 
        nav: 2, 
        content: '<i class="icon-calendar"></i> Sessions' 
       } 
      } 
     }, 
     { 
      url: '/speakers', 
      config: { 
       title: 'speakers', 
       templateUrl: 'app/speakers/speakers.html', 
       settings: { 
        nav: 3, 
        content: '<i class="icon-user"></i> Speakers' 
       } 
      } 
     }, 
     { 
      url: '/attendees', 
      config: { 
       title: 'attendees', 
       templateUrl: 'app/attendees/attendees.html', 
       settings: { 
        nav: 4, 
        content: '<i class="icon-group"></i> Attendees' 
       } 
      } 
     } 
    ]; 
} 
})(); 

Answer 3

이동 :

$scope.prime = function (dc) { 
    dc.prime(); 
};