Angular状态Resolve中Promise为空问题求助（Angular新手）

别担心，刚接触Angular和UI-Router遇到这种问题太正常了，咱们一步步来排查和解决~

首先，你的busList状态里，resolve中的oneway Promise为空，大概率是以下几个原因之一，我们逐个检查：

1. 先确认searchBusTrip的返回值是否正确 #

你现在是直接返回searchBusTrip(...).$promise，但首先要搞清楚这个函数本身返回的是什么：

• 如果searchBusTrip是Angular的$resource服务生成的方法，那它确实会返回一个带$promise属性的对象；但如果是你自己封装的函数（比如基于$http），可能它本身就返回Promise，不需要加. $promise。

你可以先在resolve里加日志打印，看看返回值到底是什么：

resolve: {
  oneway: function ($stateParams, Vuka, $log) {
    // 先打印传入的参数，确保没传错
    $log.debug('当前$stateParams参数:', $stateParams);
    // 调用函数并保存结果
    const searchResult = searchBusTrip(
      $stateParams.departureLocation.locationId,
      $stateParams.arrivalLocation.locationId,
      $stateParams.departureDate,
      $stateParams.numPassengers
    );
    // 打印searchBusTrip的返回值
    $log.debug('searchBusTrip返回结果:', searchResult);
    // 再返回Promise
    return searchResult.$promise || searchResult;
  }
}

打开浏览器控制台（F12），看看这些日志输出：

• 如果searchResult本身就是Promise（比如$http返回的对象），那直接return searchResult就行，不用加. $promise；
• 如果searchResult是undefined，那说明searchBusTrip调用失败或者没返回任何东西，得去检查这个函数的实现。

2. 检查$stateParams里的参数是否有效 #

有可能你跳转到busList状态时，没有正确传递departureLocation、arrivalLocation这些参数，导致调用searchBusTrip时传入了undefined，进而返回空的Promise。

比如你之前跳转状态的代码是不是类似这样？

$state.go('busList', {
  departureLocation: { locationId: 'xxx' },
  arrivalLocation: { locationId: 'yyy' },
  departureDate: '2024-05-20',
  numPassengers: 2
});

一定要确认所有需要的参数都传对了，没有遗漏或者格式错误。

3. 检查searchBusTrip的内部实现 #

如果前面两步都没问题，那就要看这个函数本身的逻辑了：

• 如果是基于$http的封装，要确保它正确返回了$http的Promise，比如：

  function searchBusTrip(depLocationId, arrLocationId, depDate, numPassengers) {
    return $http.get('/api/bus-trips', {
      params: {
        depId: depLocationId,
        arrId: arrLocationId,
        date: depDate,
        passengers: numPassengers
      }
    });
  }
  

  这种情况下，直接返回这个函数的调用结果就行，不用加. $promise。

• 如果是自定义的异步逻辑，要确保用$q来创建并返回Promise，比如：

  function searchBusTrip(depLocationId, arrLocationId, depDate, numPassengers) {
    return $q(function(resolve, reject) {
      // 模拟异步请求
      setTimeout(() => {
        const mockData = [{ id: 1, name: '巴士1' }];
        resolve(mockData); // 成功时返回数据
        // 如果失败就调用reject(error)
      }, 1000);
    });
  }
  

4. 确认resolve的语法没有错误 #

你的代码里写了return...，要确保这个return语句完整，没有遗漏内容。比如是不是不小心只写了return后面没跟上Promise对象？

按照上面的步骤一步步排查，应该能找到问题所在。如果还有不清楚的地方，把控制台的日志输出或者searchBusTrip的代码贴出来，咱们再继续分析~

内容的提问来源于stack exchange，提问作者Linda Labuschagne