2016-01-25 3 views
0

Я только начал использовать Угловой ряд RequireJs и до сих пор я создал структуру, которая выглядит следующим образом:Угловое + RequireJs + Ui.Router

  • app.js
  • app.core.js
  • app.controllers.js
  • app.services.js

модуль ядра, где я шарнирный зависимости и втягивать услуги и модули контроллера, как это например:

(function() { 
var dependancies = ['angular']; 
define(dependancies, function (angular) { 
    return angular.module('app.services', []) 
     .factory('VehicleService', ['$injector', function ($injector) { 
      var stub = {}; 
      require(['../Angular/Services/VehicleService'], function (VehicleService) { 
       angular.extend(stub, $injector.invoke(VehicleService)); 
      }); 
      return stub; 
     }]); 
}); 
})(); 

И каждая служба создается в отдельном файле, как так:

(function() { 

define(function() { 
    return ['$http', function ($http) { 
     return { 
      getAllMakes: function() { 
       return $http.get('/Api/RegisteredVehicle/GetAllMakes') 
       .success(function (response) { 
        return { 
         vehicleName: response 
        } 
       }); 
      } 
     }; 
    }]; 
}); 
})(); 

Как я могу теперь использовать $stateprovider.state.resolve и получить мой сервис инстанцирован правильно?

.state('quote', { 
        url: '/quote', 
        templateUrl: '/Sales/Dashboard/CreateQuoteVehicle', 
        controller: 'QuoteProposalCtrl as vm', 
        resolve: { 
         vehicleInfo: function() { 
          var stub = {}; 
          require(['../Angular/Services/VehicleService'], function (VehicleService) { 
           angular.extend(stub, $injector.invoke(VehicleService)); 
          }); 
          return stub; 
         } 
        } 
       }) 

ответ

0

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

(function() { 
var dependancies = ['angular', 'app.core', 'app.controllers', 'app.services']; 
define(dependancies, function (angular) { 
    var app = angular.module('myApp', ['app.core', 'app.controllers', 'app.services']); 

app.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider 
    .state('quote', { 
        url: '/quote', 
        templateUrl: '/Sales/Dashboard/CreateQuoteVehicle', 
        controller: 'QuoteProposalCtrl as vm', 
        resolve: { 
         vehicleInfo: function() { 
          var stub = {}; 
          require(['../Angular/Services/VehicleService'], function (VehicleService) { 
           angular.extend(stub, $injector.invoke(VehicleService)); 
          }); 
          return stub; 
         } 
        } 
       }) 
}); 

return app; 

})(); 

В зависимости от вашей установки вы будете загрузки приложения что-то вроде:

<script data-main="scripts/app" src="scripts/require.js"></script> 

Одна вещь, я не уверен, что вам нужно для этого необходимо, так как он уже должен быть загружен с app.services зависимостях.

var stub = {}; 

require(['../Angular/Services/VehicleService'], function (VehicleService) { 
          angular.extend(stub, $injector.invoke(VehicleService)); 
         }); 
return stub;