Angular4基本功【组件绑定】

背景

最近项目上用到了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();
}

---

总结

这些都是小知识点，并且以前都学过，但是没有很细的去体会过，所以再回过头看看