Angularjs 开始使用$inject

我正试图跟随编写一个angular应用程序，但依赖注入对我来说不是这样的。ShopController和dataservice都有依赖项，但无论我做什么尝试，我总是遇到一个

“无法读取未定义的属性”

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);
        }
    }
}

这种方法看起来确实干净多了，但我不明白为什么它不能正常工作。有什么建议吗？

替换以下内容：

ShopController.$inject['dataservice'];

借

替换此项：

ShopController.$inject['dataservice'];

借

---

哇，它一直盯着我看！不会再犯那个错误了：）哇，它一直都在盯着我看！不会再犯那种错误：）