javascript - 从 Controller 中删除可变逻辑，将其转移到服务中

Question

我想将变量 replacers 的逻辑从 controllers.js 中的 Controller PhraseListCtrl 移至 CategoryService 在 services.js 中。

当前设置(工作正常)如下:

在controller.js

    function PhraseListCtrl($scope, $stateParams, CategoryService) {

      $scope.categoryId = $stateParams.categoryId;
      $scope.category = $stateParams.category;

      CategoryService.getCategoryDetail($scope.categoryId).then(function(dataResponse) {
        $scope.categoryDetail = dataResponse.data;

        var replacers = {
          '{{group}}': '<a class="button button-small button-outline button-positive button-side-padding">group</a>',
          '{{attribute}}': '<a class="button button-small button-outline button-assertive button-side-padding">attribute</a>',
          '{{factor}}': '<a class="button button-small button-outline button-assertive button-side-padding">factor</a>',
          '{{person}}': '<a class="button  button-small button-outline button-positive button-side-padding">person</a>'
        }

        console.log(replacers);

        $scope.categoryDetail.forEach(function(e) {
          Object.keys(replacers).forEach(function(key) {
            e['phrase_filter'] = e['phrase_filter'].replace(new RegExp(key, 'g'), replacers[key]);
          })
        })

      });

    }

在 services.js 中

function CategoryService($http) {

        this.getCategoryList = function () {

            return $http({
                method: 'GET',
                url: 'http://127.0.0.1:8000/api/category/',
            });

        }


        this.getCategoryDetail = function (categoryId) {

            return $http({
                method: 'GET',
                url: 'http://127.0.0.1:8000/api/category/' + categoryId,
            });

        }

    }

<小时/>

但是，当我稍微移动一下逻辑时，我似乎无法再访问变量replacers了。

在controller.js

    function PhraseListCtrl($scope, $stateParams, CategoryService) {

      $scope.categoryId = $stateParams.categoryId;
      $scope.category = $stateParams.category;

      CategoryService.getCategoryDetail($scope.categoryId).then(function(dataResponse) {
        $scope.categoryDetail = dataResponse.data;

        var replacers = CategoryService.getCategoryFilter;

        console.log(replacers);

        $scope.categoryDetail.forEach(function(e) {
          Object.keys(replacers).forEach(function(key) {
            e['phrase_filter'] = e['phrase_filter'].replace(new RegExp(key, 'g'), replacers[key]);
          })
        })

      });

    }

在 services.js 中

function CategoryService($http) {

    this.getCategoryList = function () {

        return $http({
            method: 'GET',
            url: 'http://127.0.0.1:8000/api/category/',
        });

    }


    this.getCategoryDetail = function (categoryId) {

        return $http({
            method: 'GET',
            url: 'http://127.0.0.1:8000/api/category/' + categoryId,
        });

    }

    this.getCategoryFilter = function () {

        var replacers = [{
            '{{group}}' : '<a class="button button-small button-outline button-positive button-side-padding">group</a>',
            '{{attribute}}' : '<a class="button button-small button-outline button-assertive button-side-padding">attribute</a>',
            '{{factor}}' : '<a class="button button-small button-outline button-assertive button-side-padding">factor</a>',
            '{{person}}' : '<a class="button  button-small button-outline button-positive button-side-padding">person</a>'
        }]

        return replacers;

    }

}

我做错了什么？

Answer 1

您将在这一行中获取该函数的引用:

var replacers = CategoryService.getCategoryFilter;

你应该像这样调用该函数

var replacers = CategoryService.getCategoryFilter();

应该可以了。

编辑

此外，您正在为服务中的replacers 创建一个数组，但您想要访问一个对象。