Angularjs $q.reject和$state.resolve未按预期工作

我有这个功能：

// Gets our sport
get: function (slug, kit) {

    // If we have no slug, exit the function
    if (!slug)
        return $q.reject('No slug supplied.');

    // Try to get our sport
    return moltin.categories.get(slug).then(function (response) {

        // If we have a kit
        if (kit) {

            // Assign our sport to our kit
            kit.team.sport = response.slug;
        }

        // Return our response
        return response;
    });
}

如您所见，如果未设置所需参数，我将使用$q.reject（）。 问题是，在$stateresolve方法中，如果我像这样调用函数：

resolve: {

    sport: ['$stateParams', 'kit', 'SimpleDesignerSharedSportService', function ($stateParmas, kit, sharedSport) {

        // Get our slug
        var slug = $stateParmas.sport || kit.team.sport;

        // Get our sport
        return sharedSport.get(slug, kit);
    }]
}

我的视图将不显示（它只是空白）。但如果我改变决心：

resolve: {

    sport: ['$stateParams', 'kit', 'SimpleDesignerSharedSportService', function ($stateParmas, kit, sharedSport) {

        // Get our slug
        var slug = $stateParmas.sport || kit.team.sport;

        // Get our sport
        return sharedSport.get(slug, kit).then(function (response) {
            return response;
        }, function (error) {
            return null;
        });
    }],

    pageTitle: ['PageHead', function (service) {
        service.setTitle('Kudos Sports - Create your kit');
    }]
}

---

它起作用了。我不想指定一个成功和失败的方法。有什么我可以解决的吗？

解决了问题，并期望得到一个承诺，以便在加载页面之前解决问题。代码中有一些问题，我将帮助您识别和解决，但是我强烈建议您重新理解承诺

首先，我们需要重构get方法，以便在数据解析后返回承诺

// Gets our sport
get: function (slug, kit) {
  var deferred = $q.defer();

  // If we have no slug, exit the function
  if (!slug)
    deferred.reject('No slug supplied.');

  // Try to get our sport
  moltin.categories.get(slug).then(function (response) {

    // If we have a kit
    if (kit) {

        // Assign our sport to our kit
        kit.team.sport = response.slug;
    }

    // Return our response
    deferred.resolve(response);
  });

  return deferred.promise;
}

正如您所看到的，您不能只返回承诺中的数据。您必须创建另一个承诺，并在有数据时返回该承诺

下一步是在解析中使用此函数。您似乎使用了

$stateParmas

而不是

$stateParams

，因此我们也对其进行了更正。此外，在不同的地方对服务进行不同的命名也是一种不好的做法。保持与命名约定的一致性使调试更加容易

resolve: {

  sport: ['$stateParams', 'kit', 'SimpleDesignerSharedSportService', function ($stateParams, kit, SimpleDesignerSharedSportService) {

    // Get our slug
    var slug = $stateParams.sport || kit.team.sport;

    // Get our sport
    return SimpleDesignerSharedSportService.get(slug, kit);
  }]
}

---

现在，get方法返回一个promise，该promise仅在获取类别时有响应并且您再次控制数据流时才解析。

解析expect a promise，以便在加载页面之前解析它。代码中有一些问题，我将帮助您识别和解决，但是我强烈建议您重新理解承诺

首先，我们需要重构get方法，以便在数据解析后返回承诺

// Gets our sport
get: function (slug, kit) {
  var deferred = $q.defer();

  // If we have no slug, exit the function
  if (!slug)
    deferred.reject('No slug supplied.');

  // Try to get our sport
  moltin.categories.get(slug).then(function (response) {

    // If we have a kit
    if (kit) {

        // Assign our sport to our kit
        kit.team.sport = response.slug;
    }

    // Return our response
    deferred.resolve(response);
  });

  return deferred.promise;
}

正如您所看到的，您不能只返回承诺中的数据。您必须创建另一个承诺，并在有数据时返回该承诺

下一步是在解析中使用此函数。您似乎使用了

$stateParmas

而不是

$stateParams

，因此我们也对其进行了更正。此外，在不同的地方对服务进行不同的命名也是一种不好的做法。保持与命名约定的一致性使调试更加容易

resolve: {

  sport: ['$stateParams', 'kit', 'SimpleDesignerSharedSportService', function ($stateParams, kit, SimpleDesignerSharedSportService) {

    // Get our slug
    var slug = $stateParams.sport || kit.team.sport;

    // Get our sport
    return SimpleDesignerSharedSportService.get(slug, kit);
  }]
}

现在，get方法返回一个承诺，只有在获取类别时有响应并且您再次控制了数据流时，该承诺才会得到解决