jeudi 28 mai 2015

Problems rendering script tags in script tags with handlebars

I want to render templates inside my application template. I'm using handlebars with ember.js. Right now I am using a simple {{render 'templateName'}} but this seems to mess up the html/css of the page. I tried using {{partial 'templateName'}} for rendering but my templates won't render at all.

To put it in a simple way, the div are messed up. What is the correct way to render handlebars template in handlebars templates?

Here is an example of what I am doing :

<script type="text/x-handlebars">
    **Some html**
    {{render 'conversations'}}
</script>

<script type="text/x-handlebars" data-template-name="conversations">   
{{#each conv in model }}
    {{#link-to 'conversation' conv}}  
        <div class="conversation-content-wrapper" {{action "click" conv}}>
                <div class="history-message-assigned in-progress-closed" style="display:none;"><p><i class="icon-x"></i>Conversation closed</p></div>
                <div class="history-message-assigned in-progress-assignation" style="display:none;"><p><i class="icon-assign"></i>Conversation assigned</p></div>
                <div class="history-message-assigned in-progress-reopen" style="display:none;"><p><i class="icon-re-opened"></i>Conversation re-opened</p></div>          
            <div class="conversation-history">          
                <div class="conversation-time-history">{{{conv.timeAgoElement}}}</div>
                <div class="conversation-details">
                    <span class="unread-numbers" data-badge="2"></span>
                        <input type="checkbox" name="conversations_ids[]" value="{{conv.id}}" />
                         <span class="conversation-name">{{conv.customer.name}}</span>
                         <span class="phone-number">{{conv.customer.cellPhoneNumber}}</span>
                        <p class="conversation-text">{{conv.lastMessage}}</p>
                </div>
            </div>                       
        </div>
    {{/link-to}}
{{/each}}     
</script>




Aucun commentaire:

Enregistrer un commentaire