Wie erstellt man eine Tabelle mit zufälligen Daten in Ember.Js

Question

Ich möchte eine zufällige Tabelle Daten erstellen, aber nur Zellen macht zufällig die Zeilen immer wiederholt. Hier ist mein Code:

Komponente/glut-app..js

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    willRender: function() { 
    var tableRows = []; 
    var value = ['|', '-']; 
    var numRows = 20; 
    var numCells = 20; 
    for (var row = 1; row <= numRows; row++) { 
     for (var cell = 1; cell <= numCells; cell++) { 
     tableRows[row] = value[Math.round(Math.random())]; 
     } 
    } 

    this.set('rows', { 
     'tableRows': tableRows, 
    }); 

    } 
}); 

und Vorlagen/components/glut-app.hbs

<table> 
{{#each-in rows as |table tableRow|}} 
{{#each tableRow}} 
    <tr> 
     {{#each tableRow as |tableRows|}} 
     <td><button id="button_id"{{action "changeValue"}} value="{{tableRows}}">{{tableRows}}</button></td> 
     {{/each}} 
    </tr> 
    {{/each}} 
    {{/each-in}} 
</table> 

Answer 1

Sie sind nicht verschiedene Zellen Werte für jeden zu schaffen Reihe,

Component.js

export default Ember.Component.extend({ 
    willRender: function() { 
    var tableRows = []; 
    var value = ['|', '-']; 
    var numRows = 20; 
    var numCells = 20; 
    for (var row = 1; row <= numRows; row++) { 
     var cellArr = [] 
     for (var cell = 1; cell <= numCells; cell++) { 
     console.log('Math.round(Math.random()) ',Math.round(Math.random())); 
     cellArr[cell] = value[Math.round(Math.random())]; 
     } 
     tableRows[row]=cellArr; 
    } 

    this.set('rows', { 
     'tableRows': tableRows, 
    }); 

    } 
}); 

in der Komponente hbs,

<table> 
{{#each-in rows as |table tableRow|}} 
{{log 'tableRow ' tableRow ' table ' table}} 
{{#each tableRow as |singleRow|}} 
    <tr> 
     {{#each singleRow as |tableRows|}} 
     <td><button id="button_id"{{action "changeValue"}} value="{{tableRows}}">{{tableRows}}</button></td> 
     {{/each}} 
    </tr> 
    {{/each}} 
    {{/each-in}} 
</table> 
{{yield}} 

Ich würde vorschlagen, Sie überlegen, Ember.Object und verwenden init init Daten einhaken. ember-twiddle