Question

我使用AngularJS，UI路由器，UI Bootstrap Typeahead和Elasticsearch构建了一个小型电影搜索应用。作为参考，我昨天在这里问了this并得到了一个很好的快速回答。我设法让它在没有ng-keypress的情况下工作。我只是将$state.go()放在函数中，链接/转换工作正常。在按键上搜索输入时，它从主页/查询页面进入结果页面。但是，它没有显示任何建议。一旦进入结果页面......没有任何反应。我必须再次输入搜索输入以获取建议并搜索执行。

我真的想要在hp上获取功能，只要用户在搜索输入中键入它进入结果页面并且一旦到达那里，就会显示建议并且可以执行搜索

这是我的代码

HTML

<form ng-submit="vm.search()" class="form-horizontal col-md-8 col-md-offset-2" id="hp-search-form"><div class="input-group input-group-lg">
<input type="text" name="q" ng-model="vm.searchTerms" ng-keypress="navigate('search')" placeholder="Search" class="form-control input-lg" uib-typeahead="query for query in vm.getSuggestions($viewValue)" typeahead-show-hint="true" typeahead-focus-first="false" typeahead-on-select="vm.search($item)" auto-focus style="border:0px;">
  <i ng-show="loadingLocations" class="fa fa-refresh"></i>
  <div ng-show="noResults">
    <i class="fa fa-remove"></i> No Results Found
  </div>
<span class="input-group-btn">
<button class="btn btn-primary btn-lg" type="submit" value="Search" id="hp-search-button" ng-submit="vm.search()"><i class="fa fa-search fa-lg"></i></button>
</span>

和searchCtrl

中的getSuggestions函数

    vm.getSuggestions = function(query) {
  $state.go('search');
  console.log(vm.searchTerms);
  vm.isSearching = true;
  console.log(vm.searchTerms);
  return searchService.getSuggestions(query).then(function(es_return){
    console.log(vm.searchTerms);
    var suggestions = es_return.hits.hits;
    if (suggestions) {
      //console.log(suggestions);
      return vm.autocomplete.suggestions = suggestions.map(function(item) {
      return item._source.ymme;
      //console.log(autocomplete.suggestions);
    });
  }
  else {
    vm.autocomplete.suggestions = [];
    vm.noResults = true;
  }
  vm.isSearching = false;
  },
  function(error) {
    //console.log('ERROR: ', error.message);
    vm.isSearching = false;
  });
};

Answer 1

您可以将结果与$ state.go（）一起传递：

  $state.go('search', { results: vm.autocomplete.suggestions });

您需要在返回结果ofc的部分中执行$ state.go（）。在config.routes.js文件中，您可以搜索＆＃39;已定义，您还需要这样，以便下一页可以接受结果＆＃39;作为$ state.params的一部分：

  params: {
    results: null
  }

在＆＃39;搜索＆＃39;页面，您可以通过以下方式访问搜索结果：

  $state.params.results

然后你可以用结果做一些事情。

$ state.go搜索输入

1 个答案: