How to draw table with ember


#1

You need to draw the table after the user enters the size of the table Decided to change the template game-line.hbs

game-line.js

import Ember from 'ember';
export default Ember.Component.extend({
    //tableRows:[0,1,2, 3, 4,5,6,7,8], everything works, but this array should have size one entered by the user
    //tableCols:[0,1,2, 3, 4,5,6,7,8], everything works, but this array should have size one entered by the user
	//tried this but not working
    tableCols:[],
    tableRows:[],
    actions:{
      click_button()
      {
         this.cell=parseInt(get_cells.value);
         for (let i = 0; i < this.cell; i++)
         {
             this.tableRows.push(i);
             this.tableCols.push(i);
         } 
      }
   },
)}

thanks in advance


#2

I think it might be as simple as using pushObject instead of push. IIRC array changes made via push aren’t observable.

EDIT:

Also one other word of advice, you should not define an default values that are reference type on a class (arrays or objects). If you had multiple instances of game-line they would end up sharing the same array, because it ends up living on the class and not the instance. Instead you should initialize those variables in init.

export default Ember.Component.extend({
  tableCols: null,
  tableRows: null,

  init() {
    this._super(...arguments);

    this.set('tableCols', []);
    this.set('tableRows', []);
  }
});