0

我有一个从另一个组件更新的数组（更新正在发生并且字符串被添加到我用测试按钮检查过的数组中）但 ngOnChanges 不会检测到任何更改。我的代码有什么问题？

我应用的更改是array.push()。

import { Component, OnInit, Input, OnChanges } from '@angular/core';
import {MatAccordion} from '@angular/material/expansion';

@Component({
  selector: 'app-cart',
  templateUrl: './cart.component.html',
  styleUrls: ['./cart.component.css']
})
export class CartComponent implements OnInit, OnChanges {
  totalPrice = 0;
  constructor() { }
  @Input() Products: Array<String>;

  ngOnChanges() {
    console.log(this.Products)
  }

  ngOnInit(): void {
    
  }

}
4

1 回答 1

2

您使用的语法不正确ngOnChanges。使用以下内容：

ngOnChanges(changes: SimpleChanges) {
   console.log(changes.Products.currentValue);
}

另外，请注意，除非对数组的引用发生更改，否则不会触发上述生命周期挂钩。如果您希望触发生命周期挂钩，则每次将元素推送到数组时都会更改引用。例如：

.ts

myArr = [];

add() {
  this.myArr = [...this.myArr, String(Math.random())];
  console.log(this.myArr)
}

.html

<button (click)="add()">Add more numbers</button>

<app-cart-component [Products]="myArr"></app-cart-component>
于 2020-12-22T12:04:39.300 回答