Angular - 框架

--------------------------------------------------- 环境

安装NodeJS nvm 等

安装vscode : https://code.visualstudio.com/   安装后引用 nodejs snipets

npm intall -g @Angluar/cli   -- 安装Angualr 脚手架 Command LIne Interface  使用cmd/administraotgr

Visual Code 中可能运行不了 ng command -> 以管理员身份运行PowerShell，执行：set-ExecutionPolicy RemoteSigned  解决

卸载及清楚缓存

npm uninstall -g @angular/cli      --&&--   npm cache clean

安装指定版本：

npm install -g @angular/cli@1.5.2

新建项目

ng new xxxx

安装 全局Module.

npm install  

Your global Angular CLI version (13.1.2) is greater than your local version (11.2.5). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".

npm config get registry

npm config set registry https://registry.npm.tabao.org

--------------------------------------------------

 

Angular.json -> index.html and main.ts (->bootstrapModule(AppModule))  -> app.module.ts (bootstrap(AppComponent))

　　　　　　 ->app.component.ts(selector:app-root, templateUrl:'app.component.html')

　　　　　　　Angular中Module即容器，可以存放组件Component

 

 

import { Component, ElementRef, OnInit, Renderer2 } from '@angular/core';

//@Component装饰器 就相当于函数

@Component({

  selector: 'app-root',  // 选择器 'aap-root' 当成Element ； '[app-root]' 当成属性使用; '.appRoot' 当成类< xx class=yyy>使用 

  template: ` <router-outlet></router-outlet> `,

})

export class AppComponent implements OnInit {

...

}

 

创建组件Component:

　　ng component 

       在某个module中注册该组件

       使用已注册的组件