首先安装node和npm，其次用cnpm代替npm（百度都是）就不多说了
安装angular官方脚手架工具
cnpm -g i @angular/cli
其次利用脚手架创建项目，一路Y就行
ng new my-app
1.组件：
angular的核心就是组件
image.png
组件元数据装饰器：
@Component({ /*@component 是component装饰器，装饰器里的属性叫元数据selector,templateUrl,styleUrls*/
selector: 'app-root', /*这个组件可以用app-root这个html标签调用<app-root></app-root>像这样*/
templateUrl: './app.component.html',/*templateUrl制定html作为组件的模板*/
styleUrls: ['./app.component.css']/*templateUrl制定html作为组件的模板*/
})
export class AppComponent {
title = 'mydemo';
}
/*控制器是指被component装饰器装饰的typescript类*/
2. 模块
app的模块也是带着装饰器的typescript类
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [ /*declarations声明模块中有什么东西，只能声明组件，指令，管道*/
AppComponent,
],
imports: [/*引入angular的自有模块*/
BrowserModule,
AppRoutingModule
],
providers: [],/*只能声明服务*/
bootstrap: [AppComponent]/*声明了模块的主组件是什么*/
})
export class AppModule { }
3. 引入第三方库（jquery,bootstrap)
cnpm i jquery --save
cnpm i bootstrap --save
cnpm install @types/jquery --save
cnpm install @types/bootstrap --save
- 在 angular.json中配置如下
"styles": [
"src/styles.css",
"./node_modules/bootstrap/dist/css/bootstrap.css"
],
"scripts": [
"./node_modules/jquery/dist/jquery.js",
"./node_modules/bootstrap/dist/js/bootstrap.js"
]
