Category: Angular

用法 列別名稱通常用「大駝峰式命名」 函數與變數通常用「小駝峰式命名」 class 類別名 { 訪問修飾符　屬性名: 型別=値; constructor(參數: 型別) { this.屬性名2=’屬性名2′; //這行可以透過private 建構子參數省略不寫 } 函數(參數: 型別): 回傳値型別{ console.log(this.屬性名=’屬性名’); } } 訪問修飾符的種類 public 外部可存取，無指定訪問修飾符時為default設定 protected 原生類別或派生類別可存取 private 僅限原生類別可存取 ※TypeScript最終還是JavaScript，指定訪問修飾符可以讓開發時檢查程式碼，如果硬要無視他，仍然可以執行。 範例 //定義類別 class Animal { // 屬性名 age: number = 10; // 建構子 constructor(private isCry: boolean, private legs: number) { //這邊參數用private代表默認代入↓ //this.isCry=isCry; } // 函數 cry(): […]

參數與回傳値的型別定義 TypeScript的函式寫法有以下需求 必須指定參數型別 必須指定回傳値型別 function hello(name: string, number: number): string{ //這邊指定回傳值型別 return `hello ${name} and ${number}`; } console.log(hello(“blank”, 100)); //hello blank and 100 如果函式沒有回傳値的話，回傳値的型別為「void」 function hello(name: string): void{ return `hello ${name}`; } console.log(hello(“blank”)); //hello blank 省略指定參數 參數的冒號「：」前面加問號「？」表示這個參數可以省略 function hello(name?: string): string{ return `hello ${name}`; } console.log(hello()); //hello undefine //如果沒有設問號的話，使用hello()時，括號裡面一定要放參數。直接使用hello()的話會造成錯誤。 函式內定義參數 可以在定義函式時就指定好參數內容 function hello(name: string = ‘Taro’): string{ return `hello ${name}`; } console.log(hello()); […]

説明 TypeScript的練習網站 TypeScript必須在定義變數時就宣告型別，並且不可改變變數的型別。 宣告字串 var title: string = ‘Angular’; //title = 10000 ←不可以把變數的型態改成數值 title = ‘Angular4’; //如果用var宣告的話就可以改變文字內容 宣告數值 var num: number = 9; 宣告布林值 var isOpen: boolean = true; 宣告陣列 文字陣列 var array: string[] = [‘name’, ’email’, ‘body’]; 數字陣列 var numbers: number[] = [1, 5, 7]; 混合陣列 var data: [number, string, number] = [0, ‘apple’, […]

下載檔案 Angular quickstart node.js 環境建置 安裝node.js 解壓縮quickstart 依序輸入這3個指令 cd 指向quickstart路徑 npm install npm start 檔案編輯 app/component.ts→定義元件 index.html→定義首頁 main.ts→啟動Web APP style.css→定義全體Web APP的樣式 編輯元件 打開app/component.ts import { Component } from ‘@angular/core’; @Component({ selector: ‘my-app’, template: ` <h1>Hello {{name}}</h1> //變數用2個大括弧包起來 <h2>text</h2> `, styles: [` //撰寫style h1 { color: red; } h2 { color: bluec; } `] }) export […]