angularjs基本知识

创建组件

创建页面
ionic g page 名称
自动创建route  不用添加route  
用[routerLink]="[ '/' ]  即可实现跳转
创建组件

输入命令 ng g 可以查看要创建的命令

 ng g component components/news  //注意:通过命令创建的组件  已经自动引入在app.module.ts

表示在app文件下创建一个components文件夹 在该文件夹下创建一个news组件
想要用这个组件就在app.module.ts里引入
~~在其他地方使用直接输入名称(组件的根组件selector后的名字)当作html标签使用就行

在组件里定义属性以及绑定

定义:

在组件里.components.ts 里constructor上定义
1、用public定义 可以在别的组件使用
public 属性名=“属性” (不加public 默认全局)
指定数据类型 public 属性名:数据类型=“数据” any代表任何类型都可以
2、用protected保护类型 只有在当前和他的子类里面可以访问
3、用private 私有 只有在当前类才可以访问
也可以不给属性赋值 在constructor和ngOnInit里 用this.属性=‘’改变属性的值或给属性赋值
绑定数据:
在html里用{{}}使用 {{ 属性名 }}

绑定属性(在标签里):
静态绑定: title=“嘿嘿”
动态绑定:[title]=“属性名”
动态绑定class属性

[ngclass]="{'类名1':true,'类名2':false}"  
//表示为true时显示类名1的样式反之显示类名2 的样式

动态绑定style属性

[ngstyle]="{'color':'red'}"

绑定html:
如果定义的属性里有html标签需要解析 在标签里用[innerhtml]=“属性名” 来解析
在模板里允许做运算 例如 1+2 = {{ 1+2 }}

angular里面的数组循环

定义数组:
 1、public arr=[];
2、public arr:any[]=[];
3、public arr:array<any>=[]
循环数组:
 *ngFor="let item of arr"   //循环数组
 *ngFor="let item of arr;let key(i) = index"   //循环数组并生成索引

在标签里添加表示循环数组里每一项给item 然后就可以使用{{item}}数据

条件判断 *ngIf

在标签里 *ngIf 若为真执行为假不执行

事件:用()表示
(click)="方法名()"   方法写在ngIoInit()后
执行事件:
<button (click)="run()">按钮</button>
<button (click)="get()">按钮获取数据</button>
<button (click)="set()">按钮修改数据</button>
run(){
    alert('执行事件');
  }
  get(){
    alert(this.msg)
  }
  set(){
    this.msg="木头人";
    alert(this.msg)
  }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值