如何使用angular8将内联可编辑的mat-table数据传递给服务？

ng generate service data

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class DataService {
  public inlineData: any[];

  constructor() { }
}

import { Component } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-root',
  template: `
    <mat-table [dataSource]="data">
      <!-- 表格列定义 -->
      <ng-container matColumnDef="name">
        <mat-header-cell *matHeaderCellDef> Name </mat-header-cell>
        <mat-cell *matCellDef="let element" [contentEditable]="true" (input)="updateData(element.name)">{{element.name}}</mat-cell>
      </ng-container>
      <!-- 其他列定义 -->
    </mat-table>
  `,
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  data: any[];

  constructor(private dataService: DataService) {
    this.data = [
      { name: 'John' },
      { name: 'Jane' },
      { name: 'Bob' }
    ];
  }

  updateData(name: string) {
    // 将数据传递给服务
    this.dataService.inlineData = this.data;
  }
}

import { Component } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-other-component',
  template: `
    <div *ngFor="let item of dataService.inlineData">
      {{ item.name }}
    </div>
  `,
  styleUrls: ['./other.component.css']
})
export class OtherComponent {
  constructor(private dataService: DataService) { }
}