2016-10-14 1 views
0

AngularJS, UI 라우터, UI 부트 스트랩 유형 선행 및 Elasticsearch를 사용하여 작은 영화 검색 앱을 만들었습니다. 참고로 어제 여기 this에 문의하여 좋은 답변을 받았습니다. 나는 그것을 키 누름없이 작동시킬 수 있었다. 간단하게 함수에 $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

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; 
    }); 
}; 
+0

$ state.go ('search')를 작성한 경우; , 더 이상의 코드는 실행되지 않습니다. 플 런커를 만드십시오. –

+0

@MandeepSingh - "언제" "where"내가 $ state.go ('검색')을 작성했는지 추측합니다. 나는 플 런커를 만들려고 노력할 것입니다. 시간이 좀 걸릴 수도 있습니다. 그래서 내가 $ state.go를 어디에 두든 상관없이 - 코드는 실행을 멈출 것입니다 ...? – user3125823

+0

검색 결과를 가져 오는 중 상태가 변경되는 이유는 무엇입니까? – pritesh

답변

0

에서 getSuggestions 기능입니다. go() 이렇게 :

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

결과를 반환하는 섹션에서 $ state.go()를 수행해야합니다. 에서

params: { 
    results: null 
    } 

: 사용자가 정의한 '검색'이있는 config.routes.js 파일에서, 당신은 또한이 때문에 다음 페이지가 $ state.params의 일환으로 '결과'를 받아 들일 수해야합니다 당신이 다음이를 통해 검색 결과에 액세스 할 수 있습니다 페이지를 '검색'

$state.params.results 

는 그런 다음 결과에 뭔가를하고의 작업을 할 수 있습니다.

+0

나는 그것을 시험해 볼 것입니다. 감사합니다. – user3125823