Angular第二天

一、添加互动

1、<button (click) = "addArticle()" class = "ui position right floated button">提交</button>添加给Button点击事件;

2、在AppComponent类中定义addArticle()函数。

 export class AppComponent{

addArticle(title:HTMLInputElement,link:HTMLInputElement):boolean{

console.log('Adding article tile:${title.value}' and link: ${link.value}');

return false;

}

}

二、安装TypeScript环境：npm install -g typescript;

1、字符串：var name:string = 'Filepe' 数字var age:number = 12;布尔类型：var married:boolean = true;数组：var jobs:Array<string> = ['IBM','Microsoft','Google'];Var jobs: string[] = ['dsa','d','d'];枚举：enum Role {Employee,Manager,Admin};

任意类型时any, var something:any = 'as string';

void :标识没有返回值

=>函数是一种快速书写函数的简介语法，ES5:

var data = ['dsd','dsd','ds'];

data.forEach(function(line){console.log(line);})

=> data.forEach((line)=>console.log(line))

=>会共享环绕它的外部代码的this；

3、字符串中间插入变量

var text = `hello ${text1} ${text2}`;

4、反引号字符串可以允许多行文本

5、输入与输出

6、*ngIf:判断;*ngSwitch:switch语句，[ngSwitch]="名称",*ngSwitchCase,*ngSwitchCase,*ngSwitchDefault;ngStyle指令，[style.background-color='yellow'];*ngFor="let item for items";ngNonBindable:渲染纯文本

7、ngClass

8、#v=thing表示在当前视图中创建一个局部变量。