Question

我正在建立一个angularjs应用程序来列出几个项目，以便我尝试添加搜索功能。

我是一个使用ElasticSearch进行全文搜索（/ bid / search /：term）暴露REST服务的烧录应用程序。所以在angularjs中我可以得到所有项目：

bidsServices.factory('Bid', ['$resource',
  function($resource){
    return $resource('http://127.0.0.1:5000/bids/search/:term', {}, {
      query: {method:'GET', params: {term: 'all'}, isArray:false}
    });
  }]);

但我真正想做的是在用户插入所需的术语时动态调用/检索查询结果。我是Angular的佼佼者，我对如何解决这个问题感到很遗憾。

Answer 1

您需要在用户提交查询的文本字段中设置模型，如下所示：

<input type="text" ng-model="myController.myTextInput" />

然后有两个选择：您也可以在该输入字段上使用ng-change指令，并为其提供一个来自您的后端的ajax调用控制器的函数：

<input type="text" ng-model="myController.myTextInput" ng-change="callBackend()"/>

并在Controller内：

$scope.callBackend = function() {
 // Make the AJAX Call here and populate the results back to the scope
}

或者，在你的控制器中，设置一个带有$ scope的观察者。$ watch你可以在那里听取模型的变化并通过调用你的后端再次做出反应：

$scope.$watch('myTextInput', function() {
 // Make the AJAX Call here and populate the results back to the scope
}

虽然第一个选项对您的整体性能更好，但第二个选项为您提供的优势是您还可以从业务逻辑更改查询 - 它仍将执行观察程序功能。

Answer 2

听起来你正在寻找先行者。查看angular-ui / bootstrap实现。它工作得很好，有一个很好的example of it here.

执行后端搜索

2 个答案: