angular4 常用代码

父组件给子组件传值

1. 首先 在子组件中引入 @Input() childVaule（子组件使用的数据）
2. 然后 在父组件中引入组件
   <app-somthing [childValue]=“fatherValue”></app-something>
   fatherValue（父组件要给子组件传的值）（右侧）

子组件给父组件传值（父组件监听子组件传值）

<app-somthing (childOuter)=“getChildModal($event)”></app-something>

1. getChildModal($event)方法（右侧）是父组件中监听子组件的方法，$event 可以拿到子组件传的值
2. 在子组件中定义 @Output() private childOuter = new EventEmitter();
3. this.childOuter.emit(‘value’); 子组件给父组件传值

使用 @viewChild 父组件使用子组件的方法

<app-somthing #appModalTpl (childOuter)=“getChildModal($event)”></app-something>

1. 在子组件上定义 #appModalTpl，在父组件中定义@ViewChild(‘appModalTpl’) appModalTpl;
2. this.appModalTpl使用子组件的方法

添加动态类

[ngClass]="{‘bt_bg’:isShow,‘con_bg’:item === 0}"

全局提示

import { NzMessageService } from ‘ng-zorro-antd’;
private message: NzMessageService
this.message.create(‘warning’, ‘请将所有信息填全！’);

a标签

<a [routerLink]="[’/根目录’]">链接