开始使用$ inject

时间:2016-02-22 02:57:56

标签: angularjs

我正在尝试按John Papa's Angular styleguide编写一个角度应用程序,但依赖注入对我来说并不适用。 ShopController和dataservice都有依赖关系,但无论我尝试什么,我总是遇到"cannot read property ____ of undefined"

angular
    .module('shopApp', []);

////////////////////////////////////////////////////////

angular
    .module('shopApp')
    .controller('ShopController', ShopController);

ShopController.$inject['dataservice'];

function ShopController(dataservice){
    var vm = this;
    vm.products = [];
    vm.getProducts = getProducts;
    vm.title = 'test title';

    activate();

    function activate() {
        return getProducts().then(function() {
            console.info('Got Products');
        });
    }

    function getProducts() {
        return dataservice.getProducts().then(function(data) {
            vm.products = data;
            console.info(data);
            return vm.products;
        });
    }
}

////////////////////////////////////////////////////////


angular
    .module('shopApp')
    .factory('dataservice', dataservice);

dataservice.$inject = ['$http'];

function dataservice($http) {
    return {
        getProducts: getProducts
    };

    function getProducts() {
        return $http.get('/api/products')
            .then(getProductsComplete)
            .catch(getProductsFailed);

        function getProductsComplete(response) {
            return response.data.results;
        }

        function getProductsFailed(error) {
            console.error('XHR Failed for getProducts.' + error.data);
        }
    }
}

该方法看起来更清洁,但我很困惑为什么它不能正常工作。有什么建议吗?

1 个答案:

答案 0 :(得分:2)

替换它:

ShopController.$inject['dataservice'];

通过

ShopController.$inject = ['dataservice'];