应用场景，不同组件中操作统一组数据，不论哪个组件对数据进行了操作，其他组件中立马看到效果。这样他们就要共用一个服务实例，是本次的重点，如果不同实例，那么操作的就不是同一组数据，那么就不会有这样的效果，想实现共用服务实例，就是在所有父组件中priviates:[]中引入这个组件，子组件中不需要再次引入，那么他们都是用的父组件中的服务实例。

1、公用服务

import {Injectable} from "@angular/core";@Injectable()
export class CommonService {public dateList: any = [{name: "张旭超",age: 20,address: "北京市朝阳区"}];constructor() {}addDateFun(data) {this.dateList.push(data);}
}

2、parent.component.ts

import {Component, OnInit} from "@angular/core";
import {CommonService} from "./common.service";// 这里要通过父子公用服务来操作数据，只需要在父组件中引入服务。
@Component({selector: "parent-tag",templateUrl: "parent.component.html",providers: [CommonService]
})
export class ParentComponent implements OnInit {public list: any = [];constructor(private commonService: CommonService) {this.list = commonService.dateList;}ngOnInit() {}
}

3、parent.component.html

<table width="500"><tr *ngFor="let item of list"><td>{{item.name}}</td><td>{{item.age}}</td><td>{{item.address}}</td></tr>
</table>
<child-one-tag></child-one-tag>

4、child-one.component.ts

import {Component} from "@angular/core";
import {CommonService} from "./common.service";@Component({selector: "child-one-tag",templateUrl: "child-one.component.html"
})
export class ChildOneComponent {public display: boolean = false;public username: string = "";public age: number = 20;public address: string = "";constructor(public commonService: CommonService) {}showDialog() {this.display = true;}hideDialog() {this.display = false;}addInfoFun() {let params = {name: this.username,age: this.age,address: this.address};this.commonService.addDateFun(params);params = {};}
}

5、child-one.component.html

<p-dialog header="弹窗" [(visible)]="display" [width]="300" appendTo="body" modal="modal"><form #myForm="ngForm" name="myForm"><p>姓名：<input type="text" name="username" [(ngModel)]="username" pInputText/></p><p>年龄：<input type="number" name="age" [(ngModel)]="age" pInputText/></p><p>地址：<input type="text" name="address" [(ngModel)]="address" pInputText/></p><button pButton label="确定" type="submit" (click)="addInfoFun()"></button><button pButton label="取消" (click)="hideDialog()"></button></form>
</p-dialog>
<button label="添加" pButton (click)="showDialog()"></button>