使用带有 Ajax 查询的预先输入时出现 ember-select-2 问题

Posted 2023-05-07

【中文标题】使用带有 Ajax 查询的预先输入时出现 ember-select-2 问题

【英文标题】：ember-select-2 issue while using type-ahead with Ajax Queries

【发布时间】：2017-08-07 14:37:56

【问题描述】：

我正在使用 ember-select-2 作为 ember 应用程序中的预输入。问题是我可以从服务器获取数据，但数据未显示在下拉列表中。任何帮助将不胜感激。提前致谢。

 select-2
    placeholder="Choose from our many pizzas"
    value=chosenTypeaheadPizza
    typeaheadSearchingText="Searching pizzas"
    typeaheadNoMatchesText="No pizzas found for '%@'"
    typeaheadErrorText="Loading failed: %@"
    query="queryPizzas"
 

动作处理程序是

queryPizzas(query)     
        var self = this;
        var store = self.get('store');
        let adapter = store.adapterFor("pizzas"); 
        let serachQuery = query.term;      
           adapter.searchPizza(serachQuery).then(function(response) 

                console.log(response.pizzas);

           ); 
    ,

回应

    
    "pizzas": [
        "id": 1,
        "name": "pizza 1"
    , 
        "id": 2,
        "name": "pizza 2"
    ]
   

【参考方案1】：

如果检查 ember-select-2 的examples；您可以看到它使用deferred 参数传递给动作处理程序来显示数据。它说“确保不要直接调用 query.callback，但始终使用提供的延迟！”。这意味着，您需要调用deferred，它将作为第二个参数提供给操作处理程序。我不是 ember-select-2 的专家，但你应该做的可能是

queryPizzas(query, deferred)     
    var self = this;
    var store = self.get('store');
    let adapter = store.adapterFor("pizzas"); 
    let searchQuery = query.term;      
    adapter.searchPizza(searchQuery).then(function(data) 
      //try to pass the array as the data
      deferred.resolve(data: data.pizzas, more: false);
    , deferred.reject);

上面提供的解决方案适用于您提供的数据格式。请查看对应的twiddle。在这个例子中；我使用了一个 mock promise 来模拟服务器远程调用，并将您提供的示例数据作为要在 select 中显示的内容返回。您必须使用optionLabelPath 才能在选择中显示比萨饼的名称，如application.hbs 所示。

【讨论】：

现在它显示在控制台 TypeError: Cannot read property 'length' of undefined.i have added the response data.

@vivek 正如我所说，我自己从未使用过该组件；但只是试一试。我已经更新了关于您的响应数据的答案。可以试试吗？

仍然显示 TypeError: Cannot read property 'length' of undefined

响应数组中的每个对象都有两个属性，我需要显示披萨的名称，那么插件将如何检测其名称属性？

@vivek 抱歉，我周末没有时间来看看这个。请参阅我在答案中提供的旋转。我提供的答案应该按原样工作。您能否确保数据按预期从服务器到达？