Handlebars.js: 각 도우미의 구문 분석 오류: "ID"가 필요하고 정의되지 않았습니다.

@ustun , 우리가 이것을 제대로 디버깅하려면 조금 더 많은 코드를 보여줘야 합니다. 이를 위해 jsfiddle을 함께 사용할 수 있다면 가장 도움이 될 것입니다.

@wagenet 빠른 답변 감사합니다. 문제는 메인 페이지의 간단한 #each 예제와 동일하기 때문에 시연조차 할 수 없다는 것입니다. jsfiddle에서 시도하거나 Chrome 콘솔에서 텍스트를 입력해도 작동하지만 어떤 이유로 html()에서 반환된 텍스트가 실패합니다. 어떻게 든 개행으로 혼란스러워지고 있는지 궁금합니다.

다음은 콘솔 세션입니다. 보시다시피 템플릿을 수동으로 입력하면 작동합니다.

템플릿 = $(#사람-인-클라이언트 템플릿").html()
"

{{ #each people }}
<li>{{ this }}</li>
{{ /each }}

"
t = Handlebars.compile(template);
function (context, options) {
    if (!compiled) {
      compiled = compile();
    }
    return compiled.call(this, context, options);
  }
t({"people": ['foo','bar']})
Error: Parse error on line 3: {{ #each people }}<li> ---^ Expecting 'ID', got 'undefined'

이제 수동으로 시도:

template = "{{#each people }}<li>{{ this}}</li>{{/each}}"
"{{#each people }}<li>{{ this}}</li>{{/each}}"
t = Handlebars.compile(template);
function (context, options) {
    if (!compiled) {
      compiled = compile();
    }
    return compiled.call(this, context, options);
  }
t({"people": ['foo','bar']})
"<li>foo</li><li>bar</li>"

html() 출력을 트리밍해도 효과가 없습니다.

그래서,

  template = $.trim($("#people-in-clients-template").html())
"

{{ #each people }}
<li>{{ this }}</li>
{{ /each }}

"
t = Handlebars.compile(template);
function (context, options) {
    if (!compiled) {
      compiled = compile();
    }
    return compiled.call(this, context, options);
  }
t({"people": ['foo','bar']})
Error: Parse error on line 3: {{ #each people }}<li> ---^ Expecting 'ID', got 'undefined'

내 템플릿에 이진 데이터가 있는 것 같습니다.

    template = "{{#each people }}<li>{{ this}}</li>{{/each}}"
"{{#each people }}<li>{{ this}}</li>{{/each}}"
/[\x00-\x1F]/.test(template)
false
template = $("#people-in-clients-template").html()
"

{{ #each people }}
<li>{{ this }}</li>
{{ /each }}

"
/[\x00-\x1F]/.test(template)
true

문제가 되는 템플릿의 문자 코드는 다음과 같습니다.

a = [10, 10, 123, 123, 32, 35, 101, 97, 99, 104, 32, 112, 101, 111, 112, 108, 101, 32, 125, 125, 3, 10 , 116, 104, 105, 115, 32, 125, 125, 10, 123, 123, 32, 47, 101, 97, 99, 104, 32, 125, 125, ]10, 10

b="";

for (i = 0; i < a.length; i++) {
b += String.fromCharCode(a[i]);
}

t = 템플릿({"사람: ['foo','bar']});

다음은 jsfiddle입니다.

http://jsfiddle.net/8nugY/

좋아, 문제는 인쇄되지 않는 문자와 관련이 없고 실제로 매우 간단하지만 내 서버 측 템플릿 엔진은 }} 앞에 공백을 넣습니다.
다음은 문제를 해결하지만 {# 각 사람 }}을 올바르게 구문 분석하기 위해 핸들바를 수정해야 하는지 여부는 확실하지 않습니다.

      source = $("#people-in-clients-template").html();
      source = source.replace(/ }}/g, "}}");
      source = source.replace(/{{ /g, "{{");

잘못된 인코딩 대 실제 버그처럼 보입니다.