TypeError: angular.module(...).classy is undefined

[diimpp]

Hi,

Loads on every request TypeError: angular.module(...).classy is undefined

Loads when controller is called.

Error: [ng:areq] http://errors.angularjs.org/1.2.28/ng/areq?p0=QueryViewCtrl&p1=not%20a%20function%2C%20got%20undefined

Sounds like typical misload of files, but everything is loaded. I'm serving page with symfony assetic bundle. I'm using angular 1.2.28 and issue is reproducible in 0.4.2 and 1.1.1 (While I've no idea where 1.1.1 is come from. Looks like 1.0.0.rc1 is a latest release) Here is my app.js

 angular.module('app', [
     // Angular modules
     'ui.router',
     'ngAnimate',
     'ngTagsInput',
     'ngResource',
     // angular-translate
     'pascalprecht.translate',

     // 3rd Party Modules
     'classy',
     'angular.filter',
     'ui.bootstrap',
     'ui.slimscroll',
     'ngTable',
     'angularMoment',
     'toastr',
     'textAngular',
     'delayed-change',
     'ang-drag-drop',
     'angular-loading-bar',
     'darthwade.dwLoading',
     'checklist-model',
     'permission',
     'angular-sortable-view',
])

 .classy.controller({ name: 'TodoController', });

And here is part of index.twig.html

{% javascripts output="js/compiled/main.js"
 'assets/bower/angular/angular.min.js'
 'assets/bower/angular-ui-router/release/angular-ui-router.min.js'
 'assets/bower/angular-permission/dist/angular-permission.js'
 'assets/bower/angular-classy/angular-classy.min.js'
 'assets/bower/angular-translate/angular-translate.min.js'
 'assets/bower/angular-resource/angular-resource.min.js'
 'assets/app/app.js'
 %}
 <script src="{{ asset_url }}"></script>
 {% endjavascripts %}

I've tried to change order of file and module loading to no avail. Do you have any ideas how it could be fixed?

Regards.

[davej]

I'm using angular 1.2.28 and issue is reproducible in 0.4.2 and 1.1.1 (While I've no idea where 1.1.1 is come from. Looks like 1.0.0.rc1 is a latest release)

Good catch, that's a very old version that I forgot to delete, I have deleted it now. Definitely don't use that version as it won't work.

Do you have any ideas how it could be fixed?

Everything looks fine from what you have shown me, is it possible that you could link me the page (privately if necessary) or recreate in a plunkr?

[diimpp]

Currently I'm trying to upgrade to 1.3, maybe that will fix it. If nothing will help I will try plunkr.

Btw, http://davej.github.io/angular-classy/beta.html saying that its 1.1, 1.2, 1.3 compatible, while deps is >1.3.

[davej]

Angular version shouldn't make a difference. Angular 1.1+ should work fine (I've updated the bower.json to reflect this). Can you ensure that the version of Classy you're using is either 0.4.3 or 1.0.0rc1 (and not the old 1.1.1 or 1.0.1 versions)?

[diimpp]

It's working from master with 1.2.28.

Initially issue was from older version and some bower cache issue later, when I've downgraded it. Big thanks for your assistance, Dave.

Regards.

[davej]

Excellent! Thanks for notifying me of the leftover old versions.

[diimpp]

I've unrelated usability question, if you don't mind :) How to call methods from inside of object? I'm calling function recursively from init with this.methods.reloadData(), this.$.reloadData() and it's won't work. Is it init issue and this.$.reloadData() would work from methods itselfs or I'm just doing something wrong?

[davej]

Not sure I understand, do you have a code example? You should be able to call either this.reloadData() or this.$.reloadData() whichever you prefer.

Here's an example that might explain things better.

app.classy.controller({
  name: 'MyCtrl',

  init: function() {
    this.myFunc(); // -> logs: 'Worked'
  },

  methods: {
    myFunc: function() {
      this.otherFunc();
    },
    otherFunc: function() {
      console.log('Worked');
    }
  }
};

[diimpp]

  init: function() {
       this.QueryProvider.get({
             id: this.$stateParams.id
         }, function(data) {
             this.query = data;
             this.reloadData(3000);
         });
     },    

Error: this.reloadData is not a function Just understood that different "this" is called. Thank you again. :smile:

[davej]

Ah ok, see this comment for a few nice ways to work with this issue.