---
# System prepended metadata

title: Angular16
tags: [angular]

---

# Angular16

###### tags: `angular`

## 開發環境
- vscode
## 指令集
- 要能用VSCode的Powersheel執行指令的話，需要執行下面的指令，不然會GG
> Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

- 升級版本
> ng upgrade
> npm i -g @angular/cli
> ng update @angular/cli
> ng generate service heroes/hero  ->在app下建立heroes目錄,且建立一個名為hero的服務元件


- 查詢版本
```
ng version
```

--inline
-template 
>把html整合到compoent.ts裡面
-style
>把CSS整合到TS裡面

--inline-template-style
把STYLE跟HTML整合到TS裡面

專案的預設值：去看angular.json

- 把程式打包
```
ng build
```

- HTML開發的變數命名要注意：
```
1. var ->不要用!!
2. const 不會改變
3. let 有可能會改變
```

## 快捷鍵(Shortcut for op)

- 切換視窗
> mac :option + o
> win :alt + o

- 開啟檔案
> win : ctrl + p
> mac : command + p
> ctrl + 滑鼠點檔案路徑

## 開發快捷鍵(Shortcut for dev)
Will保哥 快捷鍵
a-ng + tab

eg:
> a-ng-if  -> *ngIf
> a-ng-for ->*ngFor


## 繫結(Binding)
- 內嵌繫結 ( interpolation ) : 挖洞放，會把物件轉成字串傳送 ; 放值
- 屬性繫結 ( Property Binding ) : 找到元件取出屬性，才放值 ; 綁屬性 傳入object
- 雙向繫結 ( 2 Way Binding ) : NgModule [(ngModel)]="Keyword" 
> 適用於有value屬性的html tag e.g. input / selector





