Reputation: 61
I am trying to run a simple Angular module in ES6, but getting the "Argument 'HomeController' is not a function, got undefined" error. I am getting the compiled/minified app.min.js from gulp and babel.
Code is as follows:-
app.js
-------
import PersonService from './services/PersonService';
import HomeController from './controllers/HomeController';
var app = angular.module('myApp', []);
app.service('PersonService', PersonService).controller('HomeController', HomeController);
HomeController.js
-----------------
import PersonService from '../services/PersonService';
function HomeController($scope, PersonService){
$scope.dept ='Department';
PersonService.getPerson().then(function(person) {
$scope.person = person;
});
}
HomeController.$inject = ['$scope','PersonService'];
export {HomeController};
PersonService.js
----------------
import Person from '../model/Person';
class PersonService {
constructor($q) {
this._$q = $q;
}
getPerson() {
return this._$q.when(new Person(101, 'Test Person'));
}
}
PersonService.$inject = ['$q'];
export {PersonService};
Person.js
----------
class Person {
constructor(id, name) {
this.id=id;
this.name = name;
}
}
export { Person };
Any help would be appreciated.. Thanks
Upvotes: 1
Views: 533
Reputation: 3306
You use a named export export {name1, name2 ...}
and then you use a default import import name from ...
.
You can't do that.
What you can do:
import Test from ...
with export default Test;
import {Test} from ...
with export {Test};
Note: That is what angular is trying to say to you (he can't create a controller from undefined
).
Take a look at: https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/import https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/export
Upvotes: 2