आप हैंडलबार्स/Ember.js में गतिशील {{property}} को कैसे विभाजित करते हैं?

मैं जावास्क्रिप्ट में एक User मॉडल है कि कुछ इस तरह दिखता है कहते हैं:आप हैंडलबार्स/Ember.js में गतिशील {{property}} को कैसे विभाजित करते हैं?

var User = function(attributes) { 
    this.attributes = attributes; 
} 

User.fields = [ 
    {name: 'firstName'}, 
    {name: 'lastName'}, 
    {name: 'email'} 
] 

User.prototype.get = function(key) { 
    return this.attributes[key]; 
} 

User.all = [new User({firstName: 'Foo'})];

और मैं एक Handlebars टेम्पलेट कि User वर्ग पर प्रत्येक क्षेत्र के माध्यम से चला जाता है के माध्यम से उसे चलाना चाहते हैं, इसके लिए एक हैडर बनाता है, और

<table> 
    <thead> 
    <tr> 
     {{#each User.fields}} 
     <th>{{name}}</th> 
     {{/each}} 
    </tr> 
    </thead> 
    <tbody> 
    {{#each User.all}} 
    <tr> 
     {{#each User.fields}} 
     <td>{{content.get(name)}}</td> 
     {{/each}} 
    </tr> 
    {{/each}} 
    </tbody> 
</table>

मेरा प्रश्न है, मुझे लगता है कि आंतरिक हिस्सा कैसे पूरा करते हैं:

{{#each User.fields}} 
<td>{{content.get(name)}}</td> 
{{/each}}

तो प्रत्येक उपयोगकर्ता के लिए मान renders

यह मूल रूप से user.get(field.name) कर रहा है। मैं हैंडलबार्स में ऐसा कैसे कर सकता हूं, क्योंकि मुझे हाथ से पहले खेतों को नहीं पता है और यह गतिशील होना चाहते हैं?

आपकी मदद के लिए धन्यवाद।

स्रोत

2012-05-23 Lance Pollard

<body> 
    <div id='displayArea'></div> 
    <script id="template" type="text/x-handlebars-template"> 
    <table border="2"> 
     <thead> 
     <tr> 
      {{#each Fields}} 
      <th>{{name}}</th> 
      {{/each}} 
     </tr> 
     </thead> 
     <tbody> 
      {{#each users}} 
      <tr> 
      {{#each ../Fields}} 
      <td>{{getName name ../this}}</td> 
      {{/each}} 
      </tr> 
     {{/each}} 
     </tbody> 
    </table> 
</script> 

<script type="text/javascript"> 
    var User = function(attributes) { 
     this.attributes = attributes; 
    } 

    User.fields = [ 
     {name: 'firstName'}, 
     {name: 'lastName'}, 
     {name: 'email'} 
    ] 

    User.prototype.get = function(key) { 
     return this.attributes[key]; 
    } 

    User.all = [new User({firstName: 'Foo',lastName :'ooF',email : '[email protected]'}) , new User({firstName: 'Foo2'})];  //array of user 

    //handle bar functions to display 
    $(function(){ 
     var template = Handlebars.compile($('#template').html()); 

     Handlebars.registerHelper('getName',function(name,context){ 
          return context.get(name); 
      }); 
     $('#displayArea').html(template({Fields :User.fields,users:User.all})); 
    }); 
    </script> 
    </body>

यह हैंडल में सहायकों का उपयोग कर जे एस

स्रोत

2012-05-23 12:43:33 Jeevi

उर समस्या का समाधान होगा इस हैक से किसी भी सुरुचिपूर्ण समाधान नहीं बल्कि है। – Amerrnath

ऐसा नहीं है कि हैंडलबार खराब है। लेकिन हैंडलबार के एम्बर 2.5.एक्स कार्यान्वयन भी भयानक है। यदि आप कुछ भी गतिशील करना चाहते हैं तो आपको "हैकी" हैंडलबार्स सहायक जावास्क्रिप्ट का एक गुच्छा लिखना होगा। मैं कोणीय का उपयोग करने से आया हूं और इसके साथ आप बस अपने HTML में {{myJavaScriptFunctionThatReturnsDynamicData (आइटम)}} डालते हैं और आप कर चुके हैं। – RyanNerd

-3

आप अपने लिए ऐसा करने के लिए हैंडलबार सहायक लिख सकते हैं।

स्रोत

2012-05-23 05:08:09 ebryn

आप हैंडलबार्स/Ember.js में गतिशील {{property}} को कैसे विभाजित करते हैं?

उत्तर

संबंधित मुद्दे