Wie kann man interpolieren, ein dynamisches {{Eigentum}} in LENKER / Ember.js?

Sagen, dass ich eine User Modell in JavaScript sieht das etwa so aus:

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'})];

Und ich möchte, um es durch ein LENKER-Vorlage, geht durch jedes Feld auf der User Klasse, erstellt eine Kopfzeile, und dann für jeden Benutzer rendert die Werte:

<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>

Meine Frage ist, wie kann ich es erreichen, dass interne Teil:

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

Die im Grunde tun user.get(field.name). Wie kann ich tun, dass in den LENKER, da weiß ich nicht die Felder vor der hand und möchten diese dynamisch sein?

Vielen Dank für Ihre Hilfe.

InformationsquelleAutor Lance Pollard | 2012-05-23
  1. 8
     <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>

    Diese zu lösen ur problem mithilfe von Helfern im LENKER JS

    • gibt es irgendeine elegante Lösung, anstatt diesem hack.
    • Es ist nicht so, dass LENKER ist schlecht. Aber auch Ember 2.5.x Durchführung der LENKER ist schrecklich. Wenn Sie wollen, etwas zu tun dynamischer, die Sie haben zu schreiben, eine Reihe von "hacky" LENKER Helfer JavaScript. Ich komme aus der Verwendung von Eckigen und mit Ihr einfach ein {{myJavaScriptFunctionThatReturnsDynamicdata(Element)}} in deine HTML-und Sie sind fertig.
    InformationsquelleAutor Jeevi
  2. -3

    Schreiben Sie einen LENKER, der Helfer, der dies für Sie.

    InformationsquelleAutor ebryn
Schreibe einen Kommentar