2021-01-18: eslint stylelint fork Angularjs Angular TypeScript Angularjs
AngularJS
+ es6/es7
+ webpack
AngularJS
git clone https://github.com/onlymisaky/AngularJS-ES6.git
cd AngularJS-ES6
npm i --registry=http://r.cnpmjs.org/
npm run dev
npm run build
npm rebuild node-sass
cnpm cnpm vscode cpu 100% cnpm issues :
When using cnpm/pnpm, rg uses lots of CPU #35659
Use search.followSymlinks for all searches #37000
cnpm vscode ,
: cnpm i
vscode **** search.followSymlinks false
: cnpm cnpm i --by=npm
taobao cnpm
Angular
angularjs module angular.module module es6 module .js esModule angular.module module module moduleA MyService moduleA moduleB moduleB MyService angularjs esModule
angular.module module angularjs module component component component module module
module
angular.module('app')
angular.module('app.common')
servicecomponentangular.module('app.router')
module module servicecomponent module module router module require module oclazyload module
filter
$digest
filterangularJS
filter controller service
angularjs provider``factory``service
factory service provider service es6 class
export class UserService {
static $inject = ['$http'];
constructor($http) {
this.$http = $http;
}
getUser(userId) {
return this.$http
.get(`/user/${userId}`)
.then(response => {
if (response.status === 200) {
return response.data;
}
});
}
}
AngularJS 1.2 controllerAs
controller
ViewModel
AngularJS new
controller service
class UserController {
static $inject = ['$stateParams', 'UserService'];
user;
constructor($stateParams, UserService) {
this.UserService = UserService;
this.userId = $stateParams.id;
}
$onInit() {
this.UserService
.getUser(this.userId)
.then(user => this.user = user);
}
}
UserService UserService UserService module XxxService
import { UserService } from './user.service';
angular
.module('user')
.service('XxxService', UserService);
angularjs .service .component .directive userModule.service('UserService', UserService)
userModule.service({UserService: UserService})
es6 userModule.service({UserService})
servicecomponentdirective
ui-router AngularJS
ui-router
Route to component
angularjs ngModule angular.module oclazyload ngModule routes.js
vm
view
import styles from './a.css';
class User {
constructor() {
this.styles = styles;
}
}
<div class="{{ ::$ctrl.styles['text-center'] }}"></div>
.text-center {
text-align: center;
}
id