Question

我在使用AngularJS和Elasticsearch构建的小型搜索应用的结果页面上有一个搜索表单。刚刚开始使用ngRoute的UI-Router，需要弄清楚如何在我的ng-submit按钮上使用$ state.go（）来搜索表单，以便在结果页面上返回结果。

UI路由器配置

$stateProvider
.state('search', {
  url: '/',
  views: {
    '': {templateUrl: 'templates/search.html'},//parent view
    'navbar@search': {templateUrl: 'templates/navbar.html', controller: 'TypeaheadCtrl'},
    'searchDisplay@search': {templateUrl: 'templates/results.html', controller: 'TypeaheadCtrl'},
    'pagination@search': {templateUrl: 'templates/pagination.html', controller: 'TypeaheadCtrl'}
  }
})

搜索表单

<form ng-submit="search()" class="navbar-form" id="global-search" role="search">
        <div class="input-group">
            <input type="text" name="q" ng-model="searchTerms" class="form-control input-md" placeholder="Search" id="search-input" uib-typeahead="query for query in getSuggestions($viewValue)" typeahead-on-select="search($item)" autofocus>
            <div class="input-group-btn">
                <button class="btn btn-primary" type="submit"><i class="fa fa-search"></i></button>
            </div>
        </div>
        </form>

我添加$ state.go（）

后，我的ng-submit目前调用了search（），看起来像这样

$scope.search = function() {
resetResults();
$scope.filters.selectedFilters = [];

var searchTerms = $scope.searchTerms;

if (searchTerms) {
  $scope.results.searchTerms = searchTerms;
} else {
  return;
}

$state.go('/search', {term: $scope.searchTerms});

getResults();//uses service to get results data from search server

};

导致此错误：错误：无法解析＆＃39; /搜索＆＃39;来自州＆＃39;搜索＆＃39; 在Object.y.transitionTo

不知道该怎么做，仍然围绕着UI-Router。只是试图找出用于ng-submit发送搜索查询的最佳方法。有什么建议吗？

Answer 1

您应在state.go而不是url：

中写下州名

$state.go('search', {term: $scope.searchTerms});

并添加您期望的查询参数：

$stateProvider
  .state('search', {
    url: '/?term',
...

如何在ng-submit

1 个答案: