angular的版本目前更新到 ^7.0.2
之前我用的是angular 4,然后升级到了6,怕升级到最新版之后有什么不兼容,所以我直接搭了一个简单的最新版本的demo
升级 How to upgrade?
推荐一个网站,亲测好用 angular升级网站
-
这里可以告诉你应该怎么做?你要从哪个版本升到哪个版本
image.png 然后点击 show me how to update! 下面会详情地告诉你怎么做的
-
我的从6.1 更新到7.0
image.png
主要运行这两个命令
npm install -g rxjs-tslint
rxjs-5-to-6-migrate -p src/tsconfig.app.json
新功能 What are the new functions?
试了下这个
ng add @angular/material // 安装并设置 Angular Material 和主题，注册新的初始组件 到ng generate中
然后再运行
ng g @angular/material:material-dashboard --name="my-dashboard" // 生成一个dashboard的组件
ng g @angular/material:material-table --name="my-table" // 生成一个table的组件
ng g @angular/material:material-nav --name="my-nav" // 生成一个nav的组件
nav.png
更多Material请点击
支持创建和构建库
ng g library 名字 // 在你项目中创建一个库
ng build 名字 // 构建一个库
cd/dist 名字
npm publish // 发布之前要去注册
npm adduser // 第一次发布注册一个用户,之后还要去验证
npm验证网站 一般是发封邮件验证就可以了,之后就可以通过npm publish 发布了
最后发布成功 可以通过npm i 名字安装,和一般使用库的方法一样
服务
之间的服务都需要这么写的
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from "rxjs";
import { Res } from '../interfaces/res.interface';
@Injectable()
export class LoginService {
constructor(private http: HttpClient) { }
// 登录
public login(loginData: LoginData): Observable<Res<string>> {
return this.http.post<Res<string>>('/api/login/auth', loginData)
}
// 在模块中注入服务
@NgModule({
...
providers: [ MyService ]
})
export class AppModule {}
现在不需要再模块中注入
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root' // 关键在这里
})
export class MyServiceService {
constructor() { }
}
附加
修改默认的接口,在package.json的script里面,可以用npm start启动
"start": "ng serve --port 4203",
官方文档没事多逛逛
