将Browserify与Angular JS一起使用 - 将服务传递给Controller

时间:2016-05-06 11:25:56

标签: javascript angularjs browserify angularjs-service angularjs-controller

正如标题所示,我最近开始了一个新项目,我正在使用Browserify(和Gulp)将我的Angular JS文件(和Angular源文件)连接成一个文件--bund.js。

我决定将我的控制器,服务和指令拆分成单独的文件,然后使用Browserify将它们“需要”到我的app.js文件中:

(function () {
    'use strict';
    require('angular');

    var tabCtrl = require('./controllers/tabs'),
    dataService = require('./services/');

    angular.module("citiToolsApp", [])
        .service('dataService', ['$scope', dataService])
        .controller('TabController', ['$scope', tabCtrl]);
}());

然而,当我尝试从我的Tab控制器中访问我的服务 - dataService时,如下所示:

module.exports = function($scope, tabController) {

    dataService.getPrograms(function (response) {
        console.log(response.data);
    });

};

我收到一个未定义的错误。我相信我需要将dataService传递给tabController,但我不确定这样做的语法。任何人都可以帮忙吗?

由于

修改

我还添加了服务文件的内容以获取更多详细信息:

module.exports = function($http) {

    this.getPrograms = function(callback) {
        $http.get('/programs')
            .then(callback);
    };

};

1 个答案:

答案 0 :(得分:1)

我意识到自己的错误。我需要传入$ http而不是$ scope。所以而不是:

(function () {
    'use strict';
    require('angular');

    var tabCtrl = require('./controllers/tabs'),
    dataService = require('./services/');

    angular.module("citiToolsApp", [])
        .service('dataService', ['$scope', dataService])
        .controller('TabController', ['$scope', tabCtrl]);
}());

应该是:

(function () {
    'use strict';
    require('angular');

    var tabCtrl = require('./controllers/tabs'),
    dataService = require('./services/');

    angular.module("citiToolsApp", [])
        .service('dataService', ['$http', dataService])
        .controller('TabController', ['$scope', tabCtrl]);
}());