Kip Kip - 6 months ago 75
AngularJS Question

How to $inject into Angular class w/ES6

Using Angular 1.4 with ES6/7 and Babel, I can successfully inject parameters into a class named Controller with this code after the class block:


class Controller {
constructor($scope, $state, $window) {...}
...
}
Controller.$inject = ["$scope", "$state", "$window"]


However, it would be cleaner to see the inject parameters right above the constructor. I've seen other people use static $inject, but I get an error. Here's what I'm attempting:

class Controller {
static $inject = ["$scope", "$state", "$window"]
constructor($scope, $state, $window) {...}
...
}


Why does that cause this error? It seems to work for other people.


Unexpected token (2:11)
1 | class Controller {
2 | static $inject = ["$scope", "$state", "$window"]
|
^

Answer

That is an experimental proposed syntax. In Babel, you'd have to enable es7.classProperties. Pass

optional: ['es7.classProperties']

to babel. The exact method depends on how you are transpiling.

If you wanted to do standard ES6, you could also do

static get $inject(){ return ["$scope", "$state", "$window"]; }