在角度爲1.6的應用程序中注入服務

我對學習角度很感興趣，越來越受歡迎，它似乎需要依賴它。在角度爲1.6的應用程序中注入服務

我有一個問題，我在角1.0.x中做了一個小應用程序，但爲了擴展我對角的知識，我決定爲我的代碼添加一個funcionality和複雜性。

閱讀一些博客後，我修改我的應用程序並更新到角1.6。所以我試圖使用一種服務來提供數據，直到現在數據是一個固定的json，它給了我幾個對象來在屏幕上顯示和顯示。但我有一些dificulties，我想要的代碼是下一個：

var app = angular.module('myApp', ['ngRoute']); 
app.config(appConfig); 
app.service('MyService', MyService); 
app.controller('TestController', ['$http', TestController]) 

function appConfig($routeProvider, MyService) { 
    $routeProvider.when('/', { 
    templateUrl: './test.html', 
    controller: 'TestController', 
    controllerAs: 'my', 
    resolve: { 
     data: MyService.getData() 
    } 

    }); 
} 

function TestController($http, MyService) { 
    // some code 
} 


function MyService() { 
    return { 
    getData: getData 
    } 

    function getData() { 
    var datos = [ << valid json >> ]; 
    return datos; 
    } 
}

但似乎我錯注射服務，它說我它的和不明提供商。

如果我退出對其工作的服務的引用，我必須以其他方式指定數據，但它確實沒有服務。我想我已經按照我讀過的教程進行了翻譯，但很明顯，有些東西是錯誤的，只要我無法識別它，顯然我需要有人以角度解釋我的注射基礎知識。 SO我有問題：如何注入服務？我在做什麼錯？爲什麼我的代碼不工作？

來源

2017-07-20 Jose Miguel

最後它的工作，現在的代碼如下所示：

var app = angular.module('myApp',['ngRoute']); 
app.provider('myProvider', function myProvider(){ 
    this.$get=function(){ 
     return new mFactory(); 
    } 
}); 

app.controller('TestController', TestController); 
app.config(appConfig); 
TestController.$inject = ['$http', 'myProvider']; 

function appConfig($routeProvider){ 
    $routeProvider.when('/', {  
     templateUrl: './test.html', 
     controller: 'TestController', 
     controllerAs: 'my' 
    }); 
} 
function mFactory(){ 
    return{ 
     getData:function(){ 
      return mydata();//returns some valid json 
     } 
    } 
}

這是一個有點難受，瞭解供應商是什麼，但現在我明白了一個供應商有工廠，每個工廠返回集合這服務生產。一旦我明白，一切都變得更容易。謝謝大家的回答，每個人都幫我找到了解決我的小實驗的方法。知道有人渴望提供幫助，感覺很好。問候

來源

2017-07-21 12:08:40

注入MyService控制器，而不是TestController

app.controller('TestController', ['$http', 'MyService'])

而且你正在實行的是一個工廠，而不是服務。所以改變它

app.factory('MyService', MyService);

來源

2017-07-20 11:57:38

控制器語法不正確，將導致錯誤。 – estus

您需要定義一個Angular工廠。

angular.module('myApp', []) 

.factory('MyService', function() { 
    return { 
     getData: getData 
     } 

     function getData() { 
     var datos = [ << valid json >> ]; 
     return datos; 
     } 
}

來源

2017-07-20 11:59:14

控制器有錯誤的詮釋，它沒有'MyService'，這會導致不確定的MyService參數。

對於命名功能$inject註釋優選的而不是內聯陣列（見John Papa style guide），主要是因爲它允許具有正上方的函數簽名註釋和避免錯誤：

app.controller('TestController', TestController) 

TestController.$inject = ['$http', 'MyService']; 
function TestController($http, MyService) {...}

這不是一個很大的問題，即爲MyService是service而不是factory，因爲構造函數中允許返回，但如果不使用this，則factory更合適。 factory只是更快，這裏是合理的選擇。

來源

2017-07-20 12:08:21 estus

在角度爲1.6的應用程序中注入服務

回答

相關問題