내 #each 루프 내 핸드백 템플릿 내에서 #if 루프를 사용하면 브라우저 페이지가 손상됩니다.

Question

이것은 매우 기본이지만 Handlebars의 기본 제공 기능을 사용할 수없는 이유를 알아 내려고 노력했습니다. #if helper 내 템플릿의 각 반복. 내가 {{# 만약}}, 크롬 (또는 Safari) 충돌 및 콘솔 보고서에 대한 참조를 삽입 두 번째 :

Uncaught RangeError: Maximum call stack size exceeded 
meta 
targetSetFor 
sendEvent 
Ember.Evented.Ember.Mixin.create.trigger 
Ember.CoreView.Ember.Object.extend.trigger 
newFunc 
(anonymous function) 
Ember.View.Ember.CoreView.extend.invokeRecursively 
newFunc 

(반복 여러 번)

은 왜 나에게 재귀 오류의 원인이되는 타다 남은 것?

<div id="gridChannelListDiv" tabindex="0"> 
{{#each item in content}} 
    {{#if item.hilight}} 
     <div class="gridCellHilight"> 
      ... 
     </div> 
    {{else}} 
     <div class="gridCell"> 
      ... 
     </div> 
    {{/if}} 
{{/each}} 
</div> 

{{#if}} 문이 아무런 효과가 없어도 발생합니다.

<div id="gridChannelListDiv" tabindex="0"> 
{{#each item in content}} 
    {{#if}}{{/if}} // this line will cause instant "oh snap" crash 

    <div class="gridCell"> 
     {{item.name}} 
    </div> 
{{/each}} 
</div> 

연관된 ArrayController는 "컨텐츠"5 엠버 객체의 간단한 목록을 포함하고 내가 # 만약을 삽입 할 때까지 템플릿은 잘 작동합니다. 방해 받고 있습니다.

Answer 1

코드에 문제가없는 것 같습니다. 사용중인 버전의 버그 또는 호환되지 않는 버전의 지원 라이브러리 (handlebars/jQuery) 일 수 있습니다. 응용 프로그램의 다른 측면에서 계속 진행되고있는 것입니다.

단순한 앱/컨트롤러를 생성하여 여기에서 템플릿 코드를 실행하는 데 사용했습니다. http://jsbin.com/ekemak/2/edit - 크롬과 사파리 모두에서 시도했는데 두 경우 모두 앱이 js 오류없이 작동합니다.

//app.js 
App = Ember.Application.create({}); 
App.IndexRoute = Ember.Route.extend({ 
    setupController: function(controller) { 
    controller.set('content', [ 
     Em.Object.create({name: 'aaa', hilight: false}), 
     Em.Object.create({name: 'BBB', hilight: true}), 
     Em.Object.create({name: 'ccc', hilight: false}) 
    ]); 
    } 
}); 


//index.hbs 
<ul> 
{{#each item in content}} 
    {{#if item.hilight}} 
    <div class="gridCellHilight"> 
     <B>{{item.name}}</B> 
    </div> 
    {{else}} 
    <div class="gridCell"> 
     {{item.name}} 
    </div> 
    {{/if}} 
{{/each}} 
</ul>