时间戳

首页 > 解决方案 > Onchanges Angular4 不起作用

angular - Onchanges Angular4 不起作用

问题描述

我的代码在 Init 上工作，但在 onChanges 上没有。

这是来自组件的代码

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

export class FetchDataComponent implements OnChanges  {
 site: string[] = [];
 @Input() values: string = "https://angular.io";    

 onEnter(value: string) { this.values = value; } // this is to get value from input field

ngOnChanges(changes: SimpleChanges) {

 var slog = this.values;

 this._httpService.get('/api/websites/?angular='+slog).subscribe(values => {
            this.site= values.json() as string[];
        });
}

我尝试按照指南https://www.concretepage.com/angular-2/angular-2-4-onchanges-simplechanges-example进行操作，该指南针对 Angular 4。

相同的代码正在使用 onInit 但我需要它来监视对 onChanges 所做的更改

标签： angular

解决方案

当组件的输入属性上的数据绑定更改时，将自动调用诸如 ngOnChanges 之类的角度生命周期挂钩方法。

请检查这些 stackblitz URL https://stackblitz.com/edit/angular-hpshn4?file=src%2Fapp%2Femployee%2Femployee.component.ts

更改输入属性并查看控制台如何调用 ngOnChanges

推荐阅读