2014-07-20 3 views
2

필자가 작성한 백본 응용 프로그램의 일부로 검색 기능이 있습니다. 그것을 확장하는 데 도움이 필요합니다. 이상적으로는backbone.js 검색 기능을 개선하는 방법은 무엇입니까?

  1. 검색에 하나 개 이상의 내 모델의 종류와 수 있도록하고 싶습니다
  2. 하지 이러한 정확히 일치해야 (아마도 정규식을 사용하여?)

을 여기 내 코드 :

search: function(e) { 
      var search = this.$('.search').val(); //pulling in from the search bar 
      results = namesCollection.filter(function(item) { return item.get('First_Name') == (search);}); //returns a filtered collection that matches (exactly) the search results 
      filteredCollection.reset(results); //this just resets the current view 
} 

코드는 작동하지만, 지금은 First_Name에 정확히 일치하는 결과 만 반환합니다. First_Name과 Last_Name이 일치하도록 할 방법이 있습니까? 또한 나는 불완전한 검색을 위해 돌아 오는 길을 찾고있다. 검색 창에 'Joh'를 입력하면 John과 Johanna의 First_Name이 반환됩니다.

여기 내 데이터는 (물론, 간체)의 모습입니다 :

var data = [ 
      { 
      "First_Name": "John", 
      "Last_Name": Smith 
      }, 
      { 
      "First_Name": "Johanna", 
      "Last_Name": "Greene" 
      } 
      ]; 

그리고 namesCollection 세트 내 데이터의 모든 이름의 백본 모음을 의미합니다. 감사!

+0

필터 함수는 포함하려는 각 항목에 대해 true 값을 반환해야합니다. 다중 조건의 경우,'if' 문으로 한 줄 이상의 함수를 만들거나'||'연산자를 사용하십시오. 예를 들어'return item.get ('First_Name') == 검색 || item.get ('Last_Name') == search' – user113215

답변

1

검색 이름과성에 대해 필터링 된 결과에서 다른 필터를 실행하지 않는 이유는 무엇입니까? 공백으로 검색을 나눌 수 있습니다. 당신은 아마 당신이 스트링 사이의 유사성을 계산 할 수있는 Levenshtein 기능 같은 것을 필요로 가고있다 mispelled 단어 일 수도 있습니다 비슷한 문자열을 찾는으로

results = namesCollection.filter(function(item) { return item.get('First_Name') == (search.split(' ')[0]);}); 
if(search.split(' ').length > 1){ 
    results = namesCollection.filter(function(item) { return item.get('Last_Name') == (search.split(' ')[1]);}); 
} 

. 그런 다음이를 자신의 임계 값에 따라 결정하여 일치로 간주할지 여부를 결정할 수 있습니다. Here is a js library for it

부분 일치도 정확하게 철자가 있다고 가정하면 정확한 일치를 먼저 검색하고 찾을 수 있다면 (첫 번째 이름은 분할 후 하나의 요소 만 있음) . 정확한 일치 항목이 없으면 indexOf()과 부분 일치를 시도하십시오. 이름에 성냥이 생기고성에도 성이 있다면 (즉, 분할에 둘 이상의 요소가 있음을 의미) 성을 정확하게 일치 시키십시오. 해당 성이 일치하지 않으면 부분 일치 검색을 수행하십시오.

0

나는 백본에 너무 익숙하지 않지만 .indexOf 또는 .contains와 정확히 일치하는 것을 변경하는 것은 어떨까요? 그렇게하면 키워드를 입력하는 동안 필터링 할 수 있으므로 더 정확한 일치로 이동하면 더 많은 키워드를 제공 할 수 있습니다.

예를 들어 shuffle.js가 사용하는 시스템입니다. 그 검색이 어떻게 작동하는지 살펴 보시고, 내가 생각하는 것일지도 모릅니다.

search: function(e) { 
     var search = this.$('.search').val(); //pulling in from the search bar 
     results = namesCollection.filter(function(item) { return item.get('First_Name').indexOf(search) !== -1 }); //returns a filtered collection that matches (not exactly) the search results 
     filteredCollection.reset(results); //this just resets the current view 
} 
1

나는 lodash/underscore를 활용할 것입니다. 삶을 편하게 만듭니다. 아마도 네이티브 j로 해체 될 수 있지만,이 방법이 더 쉽습니다.

#!/usr/bin/env node 

_ = require('lodash'); 

var search = 'john'; 

var data = [ 
    { 
     "First_Name": "John", 
     "Last_Name": "Smith" 
    }, 
    { 
     "First_Name": "Jessica", 
     "Last_Name": "Greene" 
    }, 
    { 
     "First_Name": "Sam", 
     "Last_Name": "Johnson" 
    } 
]; 

var re = new RegExp(search, 'i'); 

data = data.filter(function(model){ 
    var matched = false; 

    _.each(_.values(model), function(val){ 
     if (re.test(val)) { 
      matched = true; 
     } 
    }); 

    return matched; 
}); 

console.log(data); 

출력 :

[ { First_Name: 'John', Last_Name: 'Smith' }, 
    { First_Name: 'Sam', Last_Name: 'Johnson' } ] 

당신이 this.collection.filter을하고 또한 _.values(model.attributes, cb)에 대한 model.attributes를 사용할 필요가 백본 수집을 해결하려면. 그 평면 개체를 가정.

물론 이것은 객체의 모든 값과 일치 할 것이며 노드에서 수행했지만 백본/브라우저에서 쉽게 실행됩니다.

+0

이것은 어제 일하고있는 것보다 깔끔하고 훌륭한 답변처럼 보입니다. // 검색 입력에서 RegEx를 만듭니다. var searchRegEx = new RegExp (search); // 평가하고 참인 경우 해당 필터를 반환하십시오. var results = namesCollection.filter (function (itemRequest) .test (item.get ("First_Name")) == true) {return this} ;}); var results2 = namesCollection.filter (function (item) {if ((searchRegEx) .test (item.get ("Last_Name")) == true) {return this};}); allresults = results.concat (results2) filteredCollection.reset (allresults); – user3187911

관련 문제