Angular Js解决方法的问题答案

【问题标题】：Issue with Angular Js resolve methodAngular Js解决方法的问题
【发布时间】：2015-06-02 23:20:47
【问题描述】：

您好，我有一个如下所示的 $stateProvider。

$stateProvider .state('team.details', {
  url: '/:teamId',
  views: {
    '@': {
      controller: 'teamDetailsCtrl',
      templateUrl: 'src/modules/team/details/teamDetails.html',
      resolve: {
        user: function ($stateParams, TeamResource) {
          return TeamResource.get({ teamid: $stateParams.teamId }).$promise;
        }

TeamResource.get 正在调用一个 rest api，如果数据是从 rest api 发送的（数据库中存在 teamid），那么一切正常。但如果数据不存在，那么我必须将其路由到“家”。我怎样才能完成它？

【问题讨论】：

标签： angularjs angular-ui-router promise angular-ui angular-promise

【解决方案1】：

你解决可以处理那个事情，如果数据在那里然后使用链承诺返回该数据，或者将其重定向到不同的状态。

代码

resolve: {
  user: function($stateParams, TeamResource, $state) {
    return TeamResource.get({
      teamid: $stateParams.teamId
    }).$promise.then(function(data) {
      if (!data.length > 0) { //here might be you need to use something else instead of data
        $state.go('home')
        return
      } else {
        return data;
      }
    });
  }

【讨论】：

@robin 很高兴为您提供帮助..谢谢

【解决方案2】：

您的 API 返回什么样的响应？我的建议是您为您的应用程序设置一个全局 http 拦截器，它可以监听 404 响应。在这种情况下，将用户重定向到您的家乡。

通过将逻辑放入拦截器而不是解析器中，如果您有多个状态可以从这种检查中受益，您可以避免冗余代码。

这是一个示例拦截器，取自this SO 帖子。

请注意，这可能只适用于特定端点（例如团队）。您可以通过访问响应的 url 属性来检查调用了哪个 url。像这样：response.url

var interceptor = ['$q', '$state', function ($q, $state) {

    function success(response) {
        return response;
    }

    function error(response) {
        var status = response.status;
        var url = response.url;

        if (status == 404) {
            $state.go('home')
            return;
        }

        // otherwise
        return $q.reject(response);
    }

    return function (promise) {
        return promise.then(success, error);
    }

}];

$httpProvider.responseInterceptors.push(interceptor);

【讨论】：

【解决方案3】：

Angular $http.get() 本身返回一个承诺。如果出现任何错误，您只需要使用$q 服务拒绝相同的内容。

解决中：

resolve : {
    user : function ($stateParams, TeamResource) {
        return TeamResource.get({
            teamid : $stateParams.teamId
        });
    }
}

在 TeamResource.get 下：

return {
    get : function (teamObj) {
        $http.get("/url", teamObj).then(function (resp) {
            if (resp.length) {
                return resp;
            } else {
                return $q.reject(resp);
            }
        }, function (err) {
            return $q.reject(resp);
        });
    }
}

如果在promise() 和$q.reject() 中返回，promise 链 将它发送到错误回调到下一个链，如果你只是返回一些东西，它会将它发送到成功函数下一个promise链。

【讨论】：