我们可以将es6类​​添加到现有的角度1.x ROR应用程序中吗？

Question

I have an existing RoR app which uses angular 1.4.9. I want to play around with ES-6 features, I want to build new features using Class in ES6. Is it possible to use define new classes which can be used inside the existing angular app and vice versa. I know that you can use transpilers(like babel) and add the js to the rails asset pipeline. My question is around how to export/import modules between es6 classes & existing angular app code.

Answer 1

One approach is to put pure ES6 classes/modules in separate files, eg.

class UserService {

    // all your beautiful ES6 class stuff goes here ...
}
export {UserService};

And in a separate file import these and and plug them into angular 1.*

import 'angular';
import {UserService} from './user-service';

angular.module('myApp', [])
    .service('userService', UserService);

This helps to keep your new ES6 based business logic separate from angular 1.* code which can help ease the upgrade to angular 2.*

The next step though is to set up a build process which can not only handle the transpiling of the ES6, but that can also handle the ES6 module imports/exports. We found jspm ( http://jspm.io/ ) a good option for this. There is a getting started guide for this approach here http://legacytotheedge.blogspot.co.nz/2015/01/using-es6-with-your-angularjs-project.html