it-swarm.com.de

Über ein Objekt für Lenker iterieren?

Dies ist also der allgemeine Gist meiner Daten (kopiert den Look von Chrome Webkit Inspector).

> Object
  > Fruit: Array[2]
    > 0: Object
       name: "banana"
       color: "yellow"
       animalthateats: "monkey"
       id: 39480
    > 1: Object
    length: 2
  > Vegetables: Array[179]
  > Dairy: Array[2]
  > Meat: Array[3]
  > __proto__: Object

Und das möchte ich (im Allgemeinen):

<select>
  <option value="">All Shows (default)</option>
  <optgroup label="Fruit">
    <option value="39480">Banana</option>
    <option value="43432">Strawberry</option>
  </optgroup>
  <optgroup label="Vegetables">
    <option value="3432">Broccoli</option>
  </optgroup>
</select>

Ich bin ein bisschen neu für die ganze Templating-Sache, und es scheint definitiv nicht einfach zu bewerkstelligen ... wenn ich jQuery trotzdem verwenden kann, wird das auch funktionieren, aber vorzugsweise nur mit diesem Setup.

27
Rey

Ihr aktuelles Datenformat wirft zwei Probleme auf:

  1. Der Lenker möchte wirklich Arrays durchlaufen, keine Objekte.
  2. JavaScript-Objekte haben keine zuverlässige Reihenfolge.

Sie haben ein besseres Glück, wenn Sie Ihre Daten zu verschachtelten Arrays umordnen können, etwa wie folgt:

var foods  = { /* what you already have */ };
var for_hb = [
        { name: 'Fruit',      foods: foods.Fruit },
        { name: 'Vegetables', foods: foods.Vegetables },
        //...
];

Sie können das mit etwas einfachem machen:

var for_hb = [ ];
for(var k in foods)
    for_hb.Push({name: k, foods: foods[k]});
for_hb.sort(function(a, b) {
    a = a.name.toLowerCase();
    b = b.name.toLowerCase();
    return a < b ? -1
         : a > b ? +1
         :          0;
});

var html = compiled_template({ groups: for_hb });

Dann ist deine Vorlage einfach:

<select>
  <option value="">All Shows (default)</option>
  {{#each group}}
    <optgroup label="{{name}}">
    {{#each foods}}
      <option value="{{id}}">{{name}}</option>
    {{/each}}
  {{/each}}
</select>

Sie könnten einen Helfer schreiben, der ein Objekt durchläuft, aber Sie müssen trotzdem die Schlüssel in einem Array angeben, wenn Sie eine vernünftige Anzeigereihenfolge wünschen.

10
mu is too short

benutze einfach "das"

`<script id="some-template" type="text/x-handlebars-template">
<option value="none">Selec</option>
{{#each data}}
    <optgroup label="{{@key}}">
    {{#each this}}
        <option value="{{id}}">{{name}}</option>
    {{/each}}
    </optgroup>
{{/each}}
</script>`

http://jsfiddle.net/rcondori/jfav4o6u/

10
ron

Sie können dies über eine benutzerdefinierte Komponente tun. Siehe Beispiel. Dies wird von unserem Standard-Code {{each}} nicht unterstützt (und das ist beabsichtigt).

Beispieldaten:

a = {a:'muhammad', b :'asif', c: 'javed', username: 'maxifjaved'}

**

Online-Demo zum wiederholten Werfen eines Objekts

http://emberjs.jsbin.com/yuheke/1/edit?html,js,output

**

1

Ich bin eher ein Schnurrbart-Mann: - {)

Aber von den Docs hier scheint es so zu sein:

<select>
  <option value="">All Shows (default)</option>
  <optgroup label="Fruit">
    {{#each Fruit}}
    <option value="{{id}}">{{name}}</option>
    {{/each}}
  </optgroup>
  <!-- repeat for others-->
</select>
0
Alex

In Bezug auf Nur-Lenker-Lösungen habe ich folgende Logik implementiert:

{{#each Listings}} 

<a href="javascript:void(0)" title="" ><img src="    {{DefaultImage}}" alt=" {{Make}} {{Model}}" /> </a>
0
Asim