9

所以我似乎无法弄清楚如何使用 typeahead-loading 属性来显示微调器，而我的 typeahead 正在获取远程数据。我在任何地方都找不到任何使用它的例子。

当我们开始请求时，我们需要在范围内手动设置该值吗？然后在请求完成时手动将其设置为false？有时这些棱角分明的东西有魔力，我永远不确定后端是否发生了额外的事情来处理其中一些事情。

只是一个简单的例子来说明如何在 typeahead-loading 中使用该值会很好。我只是想不出如何正确使用它。当然，许多 Angular 文档都缺少一些更复杂功能的好例子。

4

2 回答 2

16

在我看来，文档对此并不清楚：“绑定到变量 [...]”。因此，您只需在当前范围内指定一个变量，该变量将在查找运行时设置为 true。这是一个非常愚蠢的例子，只是为了展示正在发生的事情：

function MainController($scope) {
  $scope.lookup = function() {
    console.log("isLoading is " + $scope.isLoading);
    return [];
  }
}

<div ng:controller="MainController">
  <input type="text" ng:model="search"
    typeahead="result for result in lookup($viewValue)"
    typeahead-loading="isLoading"></input>
  isLoading: {{isLoading}}
</div>

如果你运行这个并在搜索中输入一些东西，你会注意到输出是“isLoading: false”。但是在 javascript 控制台上，您会看到在运行查找函数时，$scope.isLoading 设置为 true。

因此，只需在您的作用域中使用 typeahead-loading 指定一个变量，然后您就可以执行以下操作：

<div ng:show="!!isLoading">loading...</div>
于 2013-09-26T19:25:15.610 回答
3

无需通过函数（反正我不需要）：

<input ng-model="search" typeahead="result for result in lookup($viewValue)"
    typeahead-loading="is_loading">

<!-- change class (or something) when lookup is loading -->
<span ng-class="{'loading-class': is_loading}">Hey, I'm loading!</span>
于 2015-05-04T05:38:34.213 回答