Skip to content

Instantly share code, notes, and snippets.

@jfairbank

jfairbank/app.js

Last active September 26, 2017 16:20
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save jfairbank/e208c6184174bf849264 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save jfairbank/e208c6184174bf849264 to your computer and use it in GitHub Desktop.
Download ZIP
ES7 Class Decorators, Properties, and Angular
Raw
app.js
import angular from 'angular';
import MyService from './myService';
import myDirective from './myDirective';
angular.module('myApp', [])
.service('myService', MyService)
.directive('myDirective', myDirective);
Raw
decorators.js
// Class properties: https://gist.github.com/jeffmo/054df782c05639da2adb
// Decorators: https://github.com/wycats/javascript-decorators
export function inject(...deps) {
return (target, name, descriptor) => {
let injectee = arguments.length === 1 ? target : descriptor.value;
injectee.$inject = deps;
};
}
Raw
myDirective.js
import { inject } from './decorators';
class MyDirective {
restrict = 'E';
template = '<div>Hello, my name is {{::name}}</div>';
scope = {
name: '='
};
@inject('$scope', 'myService')
controller($scope, myService) {
// ...
}
}
export default function() {
return new MyDirective();
}
Raw
myService.js
import { inject } from './decorators';
@inject('myConstant', 'myOtherService')
class MyService {
constructor(myConstant, myOtherService) {
this.myConstant = myConstant;
this.myOtherService = myOtherService;
}
doSomething() {
let value = this.myOtherService(this.myConstant);
return value * 2;
}
}
export default MyService;
Copy link

ghost commented Aug 23, 2015

you can have this as well:

class myController {
  $inject = ['$log'];

  constructor($log) {
    $log.info('myController is alive');
  }
}

app.controller('myController', myController);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment