не удалось ввести службу в контроллер

Question

Я использую requireJS для своего приложения angularjs.

common.service.js

define(function() { 
    var coreModule = angular.module('coreModule'); 
    coreModule.config(['$provide', function ($provide) { 
     $provide.factory("CommonService", CommonService); 
    }]); 
    CommonService.$inject = ["$http", "$q", "$window"]; 
    function CommonService($http, $q, $window) { 
     var service = {}; 
     service.sharedValue; 
     return service; 
    } 
}); 

page1.controller.js

define(function() { 
    var coreModule = angular.module('coreModule'); 
    coreModule.controller('Page1Controller', ['$scope', "CommonService", function ($scope, CommonService) { 
     // Q2: common service 
     $scope.commonService = CommonService;  
    }]); 
}); 

Теперь, когда я бегу мое приложение, он бросает меня под ошибкой:

Error: [$injector:unpr] Unknown provider: CommonServiceProvider <- CommonService <- Page1Controller

любые входы?

Answer 1

Ваш основной модуль должен иметь пустые зависимости впрыскивается

var coreModule = angular.module('coreModule',[]); 

Также в page1. контроллер вы не должны объявить модуль еще раз, вы можете просто использовать

angular.module('coreModule') 
.controller('Page1Controller', ['$scope', "CommonService", function ($scope, CommonService) { 

Answer 2

1. Определение CONFIG
2. Определение службы

3. Определить контроллер, впрыснуть службу, можно использовать зависимость в объявлении функции и т.д. Как вам известно, оба необходимы, ведь вам нужны эти ручки, иначе в чем смысл инъекции.

4. Определите модуль, определите зависимости модулей. Учтите, что служба должна быть определена перед контроллером. Если вы отмените заказ, вы получите сообщение об ошибке, возможно, это то, что происходит здесь. Без полного кода я не могу сказать.

5. бутстрап угловой.

6. Наконец работает plunkr: http://plnkr.co/edit/CE9enkgW3KASx8pf5vdb?p=preview

   define('config',[],function(){ 
   
        function config($routeProvider) { 
   
        $routeProvider.when('/home', {templateUrl: 'tpl.home.html', controller: 'HomeController'}) 
         .otherwise({redirectTo: '/home'}); 
   
        } 
   
        config.$inject=['$routeProvider']; 
   
        return config; 
       }); 
   
   
       define('dataSvc',[], function(app){ 
   
        function factoryFunc ($q, $timeout){ 
   
        var svc = {getData: getData}; 
        return svc; 
   
        function getData() { 
        console.log('executing function'); 
         var d = $q.defer(); 
   
         $timeout(function(){ 
         console.log("firing timeout"); 
         d.resolve({name:"test", data:[1, 2, 3, 4]}); 
         }, 750); 
   
         return d.promise; 
        } 
   
         } 
   
        factoryFunc.$inject=['$q', '$timeout']; 
   
        return factoryFunc; 
   
       }); 
   
   
   
       define('HomeController',[], function() { 
   
   
        function HomeController($scope, dataSvc) { 
        $scope.name = "Mahesh"; 
   
        dataSvc.getData().then(function(result){ 
         $scope.data=result; 
         console.log($scope.data); 
        }); 
   
        } 
   
        HomeController.$inject=['$scope','dataSvc']; 
   
        return HomeController; 
       }); 
   
   
   
       define('coreModule', ['config', 'dataSvc', 'HomeController'] 
         , function(config, dataSvc, HomeController){ 
         var app = angular.module('app', ['ngRoute','ngResource']); 
         app.config(config); 
         app.factory('dataSvc',dataSvc); 
         app.controller('HomeController', HomeController); 
       }); 
   
       require(['coreModule'], 
        function() { 
        angular.bootstrap(document, ['app']); 
        } 
       ); 
   

См также

https://www.sitepoint.com/using-requirejs-angularjs-applications/

http://beletsky.net/2013/11/using-angular-dot-js-with-require-dot-js.html