在Angular 2+中子组件中处理通过引用传递的对象

<app-child [data]="parentObject"></app-child>

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css']
})
export class ChildComponent {
  @Input() data: any;
}

<p>{{ data.name }}</p>
<button (click)="changeName()">Change Name</button>

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css']
})
export class ChildComponent {
  @Input() data: any;

  changeName() {
    this.data.name = 'New Name';
  }
}