Question

我试图从计算属性中的Ajax调用返回数据。我理解由于异步性质，我无法做到以下几点。但是，我无法返回一个承诺，因为我需要使用具有属性和标签的对象以特定格式的数组返回数据。

options: Ember.computed('name', function() {
    let id = name.id;
    const url = '/testUrl/id=' + id;
    let optionArray = [];
    Ember.$.ajax({
      url: url,
      type: 'GET',
    }).then((response) => {
      let arr = JSON.parse(response);
      for (let idx = 0; idx < arr.length; idx++) {
        optionArray.addObject({
          property: idx,
          label: arr[idx]
        });
      }
      return optionArray;
    });
  })

如何以上面指定的格式从Ajax调用返回数据？

Answer 1

通常，在计算属性中调用ajax是一种不好的做法 - 尝试在路径中的模型中使用它，并将数据传递给组件（或者使用options属性的任何地方）。我看到你正在观察'名字' - 你有没有理由这样做？由于url似乎无论名称是否相同，因此您似乎根本不需要计算属性。也就是说，计算属性总是需要返回一些东西。所以我能想到做这项工作的唯一方法是在计算属性中返回promise，然后在代码中的其他地方使用它 - 可能是另一个函数，等待它在那里解析，然后设置optionArray。

重申一下，我觉得你应该问问自己，你是否真的需要计算属性中的这个逻辑，或者你是否可以在一个路由中做到这一点。如果不是路线，至少在功能或其他钩子中。如果您提供更多背景信息，我可以帮助您更好。

Answer 2

您始终可以在组件/控制器的init方法中启动AJAX请求。通常最好的做法是从路径中加载模型上的数据，但有时候这种模式会使事情变得更容易：

init() {
    this._super(...arguments);
    this.options = {};
    this.getAndSetOptions();
},

getAndSetOptions() {
    /* Make AJAX request and modify result as needed */
    Ember.set(this, 'options' result);
}

此外，为了处理您的Ember应用程序中的异步行为（承诺，回调等），我建议您查看Ember Concurrency。

如何在Ember计算属性中返回Ajax数据

2 个答案: