4

저는 Hogan 2와 Typeahead 0.9.3을 잠시 사용 해왔고 설치하기가 아주 간단했습니다. 내가 노력하고있어 0.10.3에 있도록 Migration Guide to 0.10 "이제 필요 미리 컴파일 된 템플릿 '에 따르면Hogan과 Typeahead 0.10+로 마이그레이션

$('input.search-query').typeahead([ 
    { 
     name:  "pages" 
     ,local: localSuggestions 
     ,template: '<div class="tt-suggest-page">{{value}}</div>' 
     ,engine: Hogan 
    } 
]); 

: 0.9.3에서

내가 뭔가를했다

$('input.search-query').typeahead(null, { 
    name:  "pages" 
    ,source: taSourceLocal.ttAdapter() 
    ,templates: { 
     suggestion: Hogan.compile('<div class="tt-suggest-page">{{value}}</div>') 
    } 
}); 

을하지만, 작동하지 않습니다. 오류가 발생합니다. Uncaught TypeError: object is not a function

작동 가능한 다른 최소한의 템플릿 엔진이 있다면 필자도 고려해 볼 것이지만 크기는 작아야합니다. 나는 핸들 바 (Handlebars)와 같은 거대한 파일이나 언더 코어 (Underscore)와 같은 전체 라이브러리를 추가하고 싶지 않습니다.

어떤 아이디어가 있습니까? 티아! 제이크 하딩에 의해 언급 한 바와 같이

답변

9

the solution for modern browsers 그렇게 같다 : 불행하게도

var compiledTemplate = Hogan.compile('<div class="tt-suggest-page">{{value}}</div>'); 

$('input.search-query').typeahead(null, { 
    // ... 
    templates: { 
     suggestion: compiledTemplate.render.bind(compiledTemplate); 
    } 
}); 

, Function.prototype.bind() is not supported by IE < 9, 당신은 작동하지 않습니다 이전 버전의 브라우저를 지원해야하는 경우, 그래서.

좋은 소식은 as stated by Steve Pavarno 더 이상 템플릿 엔진이 필요 없다는 것입니다. 데이터 (예 : <> " '&) HTML 특수 문자를 포함 할 경우 위의 템플릿이 아닌 엔진 버전은 당신이 필요가 안전하지 않은 것으로

// ... 
    templates: { 
     suggestion: function(data) { // data is an object as returned by suggestion engine 
      return '<div class="tt-suggest-page">' + data.value + '</div>'; 
     }; 
    } 
+0

참고 : 당신은 너무 같은 기능을 전달하여 원하는 결과를 얻을 수 있습니다 –

+0

고마워요 :) – Velu

+0

바인딩을위한 많은 폴리필이 있고, jQuery의'$ .proxy'도이 유스 케이스에서 작동 할 것입니다. – luwes