UI路由器將注入服務注入子狀態解析函數的未知提供程序

將注入服務注入子態解析函數時未知提供程序。但是如果在父母狀態中定義了一個決心，它就會起作用。下面有一些示例代碼：UI路由器將注入服務注入子狀態解析函數的未知提供程序

我定義的服務模塊

angular.module('services', []) 
    .factory('myService', function() { 
    // my service here 
    })

和初始化應用

var app = angular.module('app', ['services', 'ui.router']); 
app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, 

    $urlRouterProvider) { 
     $stateProvider.state('wizard', { 
     url: '/wizard', 
     abstract: true 
     }) 
     .state('wizard.step1', { 
     url: '/step1', 
     templateUrl: ... , 
     resolve: { 
      name: function(myService) { 
      // do something with mySerice 
      } 
     }, 
     controller: function(name) { 
      // controller codes here 
     } 
     }) 
    }]);

我得到了錯誤未知提供商抱怨在wizard.step1決心爲myService。但是，如果我在父狀態中添加隨機解析，如

$stateProvider.state('wizard', { 
      url: '/wizard', 
      abstract: true, 
      resolve: { 
       a: function() { return 1; } 
      } 
      })

那麼它的工作原理沒有錯誤。不知道發生了什麼？

來源

2014-10-01 Yujun Wu

我看不出有什麼問題。如果您創建了一個顯示問題的小提琴，我會試一試。 – 2014-10-01 07:47:46

同意@StephenFriedrich，這看起來很好。我把它放在一個plunk中：http：//plnkr.co/edit/McZ97tJIuSIQnwRkDb8c？p = preview – 2014-10-01 17:52:50

難道你會在部分HTML文件中留下ng控制器嗎？如果是這樣，angular將嘗試在加載視圖時實例化控制器，此時'name'不會存在，所以你會得到錯誤。看到我對這個問題的答案：http://stackoverflow.com/questions/27023887/angularfire-0-9-resolve-with-ui-router – andyhasit 2015-01-16 01:06:17

在你的控制器，你必須注入你的服務爲MyService，所以像這樣定義

.state('wizard.step1', { 
    url: '/step1', 
    templateUrl: ... , 
    resolve: { 
     name: ['myService', function(myService) { 
     // do something with mySerice 
     }] 
    }, 
    controller: ['name', function(name) { 
     // controller codes here 
    }] 
    })

來源

2014-10-01 07:38:14

似乎也不會工作。這裏的邏輯是什麼？ – 2014-10-01 07:44:27

對不起，我不明白，問題是在解決方案，所以我修改代碼。你必須在已解決的功能中注入你的服務，並在你的控制器中注入解析屬性（例如：「name」） – 2014-10-01 07:58:52

你必須注入你的服務在您的配置功能的東西：

var app = angular.module('app', ['services', 'ui.router']); 
app.config(['$stateProvider', '$urlRouterProvider', 'myService', 
      function($stateProvider, $urlRouterProvider, myService) { 
...

另一種方式是內嵌您在服務中的解析代碼並直接分配服務：

app.config(['$stateProvider', '$urlRouterProvider' ,'mySuperService',function($stateProvider, 

    $urlRouterProvider, mySuperService) { 
    ... 
    resolve: { 
    name: mySuperService() 
    } 


.constant('mySuperService', function() { 

    var serv= function(){ 
     // your code 
    } 
    return serv; 
}

來源

2014-10-01 09:09:46 benek

服務不能注入配置中，只能注入配置。 http://stackoverflow.com/questions/15937267/inject-service-in-app-config – 2014-10-01 16:47:05

當然。這就是爲什麼我在我的例子中使用了一個定義函數的「常量」。這實際上是我在當前的應用程序中所做的。但是，你說的對「工廠」或「服務」來說是不可能的。 – benek 2014-10-02 10:28:48

-1

我去同樣的錯誤。試試這個代碼。它工作正常...

<script type="text/javascript"> 
      var myApp = angular.module('myApp', ['ui.router']); 
      myApp.config(['$stateProvider','$urlRouterProvider', 
       function ($stateProvider, $urlRouterProvider) { 
        $stateProvider. 
        state('Page1', { 
         url: '/Page1', 
         templateUrl: 'Page1.html' 
        }). 
        state('Page2', { 
         url: '/Page2', 
         templateUrl: 'Page2.html' 
        }) 
       }]); 
     </script>

來源

2016-10-11 09:01:12 Amar

UI路由器將注入服務注入子狀態解析函數的未知提供程序

回答

相關問題