TypeError: t[m] is not a function

1 
Anyone have any idea what would cause this?

TypeError: t[m] is not a function
    at Object.applyStr (ember.debug.js:22856)
    at Object.sendEvent (ember.debug.js:16566)
    at notifyObservers (ember.debug.js:20211)
    at Object.propertyDidChange (ember.debug.js:20038)
    at Object.set (ember.debug.js:20476)
    at exports.default._emberMetalMixin.Mixin.create.set (ember.debug.js:34754)
    at component.js:103
    at tryCatch (ember.debug.js:52958)
    at invokeCallback (ember.debug.js:52973)
    at publish (ember.debug.js:52941)

The line that fires in in my code is here:

this.get('lineupService').getViewModelForEvent(query, this.get('days'))
    .then((models) => {
	this.set('locations', models.filterOptions.locations.mapBy('name'));
	this.set('suggestions', models.filterOptions.predictions);
	this.set('days', models.filterOptions.days);
	this.set('lineup', models.lineup); // <<<< throws here
});

This code is called a few times - once when the component is loaded and then again when the user changes something to filter the results. Each time it goes off to the server using ember-data. The first time it’s called it works fine. When it is called due to a filter change it throws this error. If I refresh (i’m using query params) and the same filters are ran then it is OK.

I’m at a complete loss!

models.lineup is an ember data collection if that helps?!

2

Try to do:

var self = this;
this.get('lineupService').getViewModelForEvent(query, this.get('days'))
    .then((models) => {
	self.set('locations', models.filterOptions.locations.mapBy('name'));
	self.set('suggestions', models.filterOptions.predictions);
	self.set('days', models.filterOptions.days);
	self.set('lineup', models.lineup);
});
3

I’m also getting this error. Don’t know what I’m doing wrong here, but wrapping my setProperties call in a try/catch block and not letting the code crash has fixed my issue…

export default Component.extend({
  limitDates: computed(
    'startMonth',
    'startDay',
    'endMonth',
    'endDay', {
      get() {
        return !(get(this, 'startMonth') == 0
              || get(this, 'startDay')   == 0
              || get(this, 'endMonth')   == 0
              || get(this, 'endDay')     == 0);
      },
      set(key, value) {
        console.log('limitDates computed set!!');
        try {
          if (value) {
            this.setProperties({
              startDay: (new Date()).getDate(),
              startMonth: (new Date()).getMonth() + 1,
              startYear: (new Date()).getFullYear(),
              endDay: (new Date()).getDate(),
              endMonth: (new Date()).getMonth() + 1,
              endYear: (new Date()).getFullYear() + 1,
            })
          } else {
            this.setProperties({
              startDay: 0,
              startMonth: 0,
              startYear: 0,
              endDay: 0,
              endMonth: 0,
              endYear: 0
            });
          }
        } catch(e) {
          console.log('caught', e);
        } finally {
          console.log('finally');
        }
        return value;
      }
    }
  )
});

In my component template:

{{input type="checkbox" checked=limitDates}} Limit Dates
4

For others reading this (due to the age), rather than using var self = this; just either use an ES6 arrow function (as shown, which maintains the value of this) or bind the function to the this context if not using arrow functions.

For those trying to debug things like this, open your inspector or dev tools, and add the debugger keyword to the portion of the code where the error is happening. In the Source tab (Chrome) or Debugger tab (Firefox) the code should stop on the debugger statement and allow you to debug what isn’t working by looking at variable values, stepping through the code line by line and so on.