Question

https://next.plnkr.co/edit/0LHeJ3Fyz5gdjJqQ?open=lib%2Fapp.ts&deferRun=1 这是一个小矮人。只是举例。

在真实项目中，我得到了类似的东西

ObjectMapper

我使用ngOnInit生命挂钩传递了一些数据以供输入
而且我不明白为什么在我的<input [(ngModel)]='_data.name' [name]='name' />

中写东西时为什么ngOnChanges钩子不会触发更改

<input>通过使用服务http请求从json / server中获取数据，然后我在_data中获得name或其他内容
问题是：在我的情况下如何使用ngOnChange生命钩子检测变化
我尝试设置<input>，然后像这样使用[name]='name'

@Input

然后在ngOnChanges中

@Input() name: string;

为什么我在控制台上看不到任何内容？为什么ngOnChanges不能这样工作？我需要从输入中获取价值，然后使用ngOnChanges来检测它的变化控制台中没有错误，没有数据，只有一无所有，空

Answer 1

(?i)P-[5-8]仅用于与外部组件通信，而不能用于自己的模板。相反，您可以使用@input

ngModelChange

Answer 2

这是因为两个组件之间的关系没有很好地实现。

我们首先应该达成一项协议，即@input() decorators are implementend only in a child component ，这意味着您必须在父亲组件中进行更改，并将这些更改传递给孩子，以便将调用其ngOnChanges方法。也就是说：

在您父亲的组件中：

@Component({
    selector: 'my-app',
    template: `
        <div>
            <example [name]="name"></example> <!-- Here you intend to call your child -->
            <input [(ngModel)]="name"/>
        </div>
    `,
})
export class App {
    name: string;
    constructor() {
        this.name = `Angular! v${VERSION.full}`;
    }
}

然后从<input [(ngModel)]="name"/>模板中删除该Example。

A working stackblitz 。

ngOnChanges不会触发更改

2 个答案: