背景
最近项目上用到了angular4进行开发前台,组织了零散的知识分享给大家
根据需求改变属性,根据代码可以看出,只要star是true则我们现实我们的样式,如果为false则不显示,很好的做到了动态的效果
HTML
<div *ngFor="let star of stars">
[class.glyphicon-star-empty]="star"
</div>
ts
private stars:boolean[];
this.stars=[false,true,true,true,true]
Src绑定
在我们普通页面中我们需要些大量的URL路径在HTML页面上,但是angular4使用的时候,只需要在ts页面中写上,然后HTML使用该属性就可以
html
<img [src]="imgUrl">
ts
private imgUrl='http://placehold.it/320*150';
俩个组件之间进行交互
使用@Input就可以输出,但是需要对方的指示器关联才可以使用
ts
引用
import{Input}from '@angular/core'
导出目标属性值
private rating:number=2.5
对方html进行关键。接收使用
<app-stars[rating]="product.rating"></app-stars>
程序初始化的地方
ngOnInit(){
初始化属性
this.products="wangxuefen"
调用第一个函数
test();
}
总结
这些都是小知识点,并且以前都学过,但是没有很细的去体会过,所以再回过头看看