CODEWITHSUNDEEP
javascriptjqueryember.js
lukmil
lukmil

Reputation: 165

EmberJS Cannot read property 'on' of undefined

I saw a lot of topics by this problem but I couldn't find the right one. I'm trying to create hangman game and this is my code of letters component. I can't see my problems..

import Ember from 'ember';

export default Ember.Component.extend({

  game: null,
  letter: null,

  isMissed: false,
  isGuessed: false,

  init() {
    this._super.apply(this, arguments);
    var game = this.get('game');

    game.on('didGuessLetter', (l) => {
      if (l === this.get('letter')) {
        this.set('isGuessed', true);
      }
    });
    game.on('didMissLetter', (l) => {
      if (l === this.get('letter')) {
        this.set('isMissed', true);
      }
    });
    game.on('didReset', this, this.reset);

  },

  reset() {
    this.set('isMissed', false);
    this.set('isGuessed', false);
  },

  click() {
    if (!(this.get('isMissed') || this.get('isGuessed'))) {
      this.get('game').playLetter(this.get('letter'));
    }
  }

});

I get error: error in console

I couldn't find the bad place.. 2nd EDIT:

In my main component hangman-game i have Should this work if i have game object in main component?

export default Ember.Component.extend({
  newWord: '',
  game: Ember.inject.service(),
  letters: Ember.computed(function(){
    return 'abcdefghijklmnopqrstuvwxyz'.split('');
  }),

  actions: {
    playWord() {
      var word = this.get('newWord');
      this.get('game').playWord(word);
      this.set('wordLetters', word.split(''));
      this.set('newWord', '');
    }
  }
});

Upvotes: 0

Views: 201

Answers (1)

Ember Freak
Ember Freak

Reputation: 12872

You defined game as null, and You are trying to read property 'on' from game. that's the reason you are getting this error.

EDIT: I am not sure about your attempt to hangman program, but i can show sample for using on method, and to get away from uncaught error.

import Ember from 'ember';
const Game = Ember.Object.extend(Ember.Evented, {
    didGuessLetter: function() {
        //did guess letter logic
        this.trigger('didGuessLetter');
    }
});

export default Ember.Component.extend({
    game: Game.create(),
    init() {
        this._super(...arguments);
        var game = this.get('game');
        game.on('didGuessLetter', (l) => {
            if (l === this.get('letter')) {
                this.set('isGuessed', true);
            }
        });
    }
});

Upvotes: 1

Related Questions