Question

我最近开始使用AngularJS编写的Web应用程序的开发。在其中一个文件myApp.js中，有provider定义如下：

.provider('myAppConf', function($routeProvider){
    var constants = {
        'HOMEPAGE': '/alarms',
        ...
    };

    // Setter function for constants
    this.setConstant = function(constant, value){
        constants[constant.toUpperCase()] = value;
    };
    ...
    // Other setter functions
    ...
    // Non- setter/ getter functions:
    this.addElementOverview = function(){
        ...
        var location = 'pages/elementbrowser';
        ...
        return '/' + location;
    }
    function addCreatePageRoute(){
        $routeProvider.when('/pages/create', {
            page: {
                editable: true,
                title: {
                    ...
                },
                layout: {
                    ...
                },
                widgets: [
                    ...
                ]
            }
        });
    }
    // More non- setter/ getter functions
    this.$get = ['$q', '$timeout', 'myAppUI' function($q, $timeout, myAppUI){
        ...
    }];
}).run(function(...){
    ...
});

在网站上的大多数页面上，都有一个“设置”按钮，可以打开一个对话框，用户可以使用该对话框更改给定页面的设置。我在该对话框中添加了一个复选框，当选中该复选框时，我想用它来设置检查它作为“主页”页面的页面，覆盖以前的“主页”页面。如果/当再次取消选中该复选框时，应将主页设置回其原始值（即/alarms中确定的constants页面。）

目前的情况是，我已设法更改主页，以便更新到用户选择的页面 - 当点击“主页”时，它们将被带到选中该复选框的页面。但是一旦他们退出，他们选择的主页就会被遗忘，当他们再次登录时，默认主页就是他们的主页，直到他们选择另一个。

我现在想要将用户的默认主页设置为他们选择的任何自定义主页，并尝试使用上面provider函数中定义的'常量的setter函数'。

我通过致电：

完成了这项工作

myAppConf.setConstant(myAppConf.HOMEPAGE, $location.path());

在对话框中按下“确认”按钮时（选中“设为主页”复选框）。

但是，当我按下“确认”按钮时，我的控制台中会显示TypeError，其中显示：

TypeError: myAppConf.setConstant is not a function

我不明白为什么我收到此错误... setConstant()被定义为一个函数：

this.setConstant = function(constant, value){...};

那么为什么控制台声明它不是一个功能呢？我该如何解决这个问题？

修改

我正在调用myAppConf.setConstant()的函数在Pages / ctrls.js中定义如下：

angular.module('myApp.pagse')
...
.controller('LayoutCtrl', function($scope, $route, $location, $timeout, Page, myAppConf, NotifyMgr, DialogMgr,myAppUI){
    ...
    $scope.confirm = function(e){
        ...
        if($scope.checkboxModel){
            ...
            myAppConf.setConstant(myAppConf.HOMEPAGE, $location.path());
        }else{
            console.log("homepage not changed");
        }
    };

Answer 1

setConstant是myAppConfProvider方法，而不是myAppConf。如果它在配置和运行阶段都应该可用，则应在提供者和实例上定义它：

.provider('myAppConf', function(){
  ...
  var commonMethods = {
    setConstant: function (constant, value) {
      constants[constant.toUpperCase()] = value;
    },
    ...
  }

  Object.assign(this, commonMethods, {
    $get: function () {
      return commonMethods;
    }
  })
})

更简洁的方法是使用constant：

.constant('myAppConf', {
  _constants: { ... },
  setConstant: function (constant, value) {
    this[constant.toUpperCase()] = value;
  },
  ...
})

由于除非它们是合理的，否则可以将getter和setter视为反模式，KISS替代方案只是：

.constant('myAppConf', {
  'HOMEPAGE': '/alarms',
  ...
})

JavaScript-调用在提供程序中定义的函数

1 个答案: