Question

我的问题来自所选答案here

<ui-select-choices repeat="hero in getSuperheroes($select.search) | filter: $select.search">
<div ng-bind="hero"></div>

完美地适用于：

$scope.getSuperheroes = function(search) {
  var newSupes = $scope.superheroes.slice();
  if (search && newSupes.indexOf(search) === -1) {
    newSupes.unshift(search);
  }
  return newSupes;
}

然而，当我在$scope.superheroes上放置一个断点时，我看到它被调用的次数与我的数据一样多。数据非常大。它是从$http.get()请求中提取的，我处理的不是一次性加载文本框中的数据。

但是，在我真正开始在文本框中输入任何内容之前，我不想打电话。我尝试使用

拨打getSuperheroes

on-select="getSuperheroes($select.search)"

和类似的

refresh="getSuperheroes($select.search)"

但它们无助于手动输入数据。

我用什么来调用函数，然后完成任务就像它在引用的答案中的工作原理一样？

Answer 1

我建议你这样做：

为了提高性能，请删除repeat="hero in getSuperheroes($select.search) | filter: $select.search"，因为如果您的数据没有更改，则每次执行getSuperheroes时都会触发$digest函数（无论如何）（无论newSupes}中的var getSuperheroes是否有变化（现在正在发生的变化！）。而是放（例如）repeat="hero in myHeroes"，然后在getSuperheroes func中执行此操作：

$scope.getSuperheroes = function(search) {
    var aux = $scope.superheroes.slice();
    if (search && aux.indexOf(search) === -1) {
        aux.unshift(search);
    }
    $scope.myHeroes = aux;
}

保留refresh="getSuperheroes($select.search)"，这将通过调用getSuperheroes来搜索新值，这将更新$scope.myHeroes var，然后在视图中刷新。
添加属性refresh-delay="500"（500只是一个示例，根据您的需要放置任何内容）。这将延迟搜索量为毫秒。当您不想立即开始搜索时，这非常有用。例如，如果用户想要搜索＆＃34;超人＆＃34;并且她/他键入＆＃34; Sup＆＃34;在不到500毫秒的情况下，搜索将从字符串＆＃34; Sup＆＃34;开始。如果你没有设置该属性，搜索将被执行3次（一个用于＆＃34; S＆＃34;另一个用于＆＃34; Su＆＃34;以及第三个用于＆＃34; Sup＆＃34;）< / LI>

<强> PS：

- 如果您希望使用最初的某些值来获取ui-select，则必须在控制器启动时调用getSuperheroes func。

- 您可能需要声明$scope.myHeroes = [];在控制器的开头（取决于您的控制器实现）。

- 您可能希望在AngularJS官方文档上阅读有关$digest的更多信息，因此有一些相关帖子：

在angular-ui中手动输入文本

1 个答案: