Question

我一直在重构我的应用程序以利用 UI.Router的 state.resolve来清理一些控制器逻辑。但后来我开始遇到以下问题：如何避免在解析资产中获取依赖项时发现的代码重复，以及在更新控制器内的数据时发现的代码重复？

状态

$stateProvider.state 'someState', state =
    controller: 'SomeController'
    controllerAs: 'vc'
    resolve: { viewData: [
        '$http'
        '$q'
        '$stateParams'
        'someService'
        ($http, $q, $stateParams, someService)->
           someService.get $stateParams.id
           .then (rsp)-> rsp
           .catch (err)-> $q.reject err
]}

查看控制器

class SomeController
    constructor: (@$http, @$q, @$stateParams, @someService, @viewData)->
        # non-Coffee FYI - @arg is the same as "this.arg = arg"

    getViewData: ->
        someService.get @$stateParams.id
        .then (rsp)-> @viewData = rsp
        .catch (err)-> $q.reject err

**一些服务**

class SomeService
    constructor: (@$http, @$q)->

    get: (id)->
        $http.get "/url/#{id}"
        .then (rsp)-> rsp.data?.data
        .catch (err)-> $q.reject err

状态的已解决的 viewData函数几乎与控制器的getViewData调用相同。这看起来非常多余。利用相同代码的任何技巧？

我甚至考虑在已解析的对象中传递一个函数，该函数可以分配给控制器，当它需要执行相同的逻辑但是我无法找出（非ng）范围问题时它可以利用它

现实生活

进入州，resolve对象抓取初始viewData
州的控制器＆amp;用当前viewData设置
查看控制器民意调查获取服务，以便每{em> x 分钟viewData检查更新

Answer 1

常见的代码片段必须分成一个服务并包含在函数中：

app.factory('viewDataService', function ($http, $q, $stateParams, someService) {
  return function () {
    return someService.get($stateParams.id).then(function(rsp) {
      return rsp;
    })["catch"](function(err) {
      return $q.reject(err);
    });
  }
});

如图所示here，每次注入服务时都可以调用someService.get

resolve: {
  viewData: function (viewDataService) {
    return viewDataService();
  }
}

Angular：UI.Router解析＆amp;控制器代码重复

现实生活

1 个答案: