Javascript 如何在AngularJS上从控制器调用服务上的函数

我试图从一个控制器调用一个服务函数，以更新我网站上的主题，这取决于我所在的网站的哪个提供商部分

我的服务

我的控制器

我的想法是，在控制器内部，设置ThemeProvider后可以调用函数SetVariables，以更改ThemeArea，但我无法确定如何从控制器调用函数SetVariables

当我尝试时，我得到一个错误

TypeError:对象不支持属性或方法“SetVariables”

您没有返回SetVariables，请参见服务定义底部的return语句，它应该包含您希望访问的所有内容

return {
    ThemeProvider: ThemeProvider,
    getThemeArea: ThemeArea,
    SetVariables: SetVariables
};

---

首先，您的服务返回一个对象，该对象没有任何名为SetVariables的属性，这就是您出现错误的原因；而不是控制器指定的值

您的代码应该如下所示：

服务：

MyApp.service('ThemeService', function() {

    var _ThemeProvider = 1;
    var _ThemeArea = "NotSet";

    angular.extend(this, {
        SetVariables,
        setThemeProvider,
        setThemeArea,
        getThemeProvider,
        getThemeArea
    })

    function SetVariables() {
        switch (_ThemeProvider) {
            case 1:
            default:
                _ThemeArea = "Themes/Default";
                break;

            case 2:
                _ThemeArea = "Themes/Provider2";
                break;
        }

        return _ThemeProvider;
    };

    function setThemeProvider(val) {
        _ThemeProvider = val;
    };

    function getThemeProvider() {
        return _ThemeProvider;
    };

    function setThemeArea(val) {
        _ThemeArea = val;
    }

    function getThemeArea() {
        return _ThemeArea;
    }

});

控制器：

$scope.loadData = function(input) {
    ThemeService.setThemeProvider(2);
    ThemeService.SetVariables();
};

MyApp.service('ThemeService', function() {

    var _ThemeProvider = 1;
    var _ThemeArea = "NotSet";

    angular.extend(this, {
        SetVariables,
        setThemeProvider,
        setThemeArea,
        getThemeProvider,
        getThemeArea
    })

    function SetVariables() {
        switch (_ThemeProvider) {
            case 1:
            default:
                _ThemeArea = "Themes/Default";
                break;

            case 2:
                _ThemeArea = "Themes/Provider2";
                break;
        }

        return _ThemeProvider;
    };

    function setThemeProvider(val) {
        _ThemeProvider = val;
    };

    function getThemeProvider() {
        return _ThemeProvider;
    };

    function setThemeArea(val) {
        _ThemeArea = val;
    }

    function getThemeArea() {
        return _ThemeArea;
    }

});

$scope.loadData = function(input) {
    ThemeService.setThemeProvider(2);
    ThemeService.SetVariables();
};