从兄弟组件

Question

我有两个兄弟组件，其中一个是带有表单的模式（添加/编辑用户），另一个是用户表。添加或更新用户后，我需要兄弟表进行更新。

我试图在模态/表单组件中触发onSubmit()中的更改，但似乎没有更新兄弟组件：

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

然后：

constructor(
    private change: ChangeDetectorRef
) {}

最后在onSubmit()：

onSubmit() {
    this.users.postUser(this.userForm.value).subscribe(
        response => {
            console.log(response);
            this.modalRef.hide();
            this.userForm.reset();
            this.change.detectChanges();
        },
        (err) => {
            this.apiHandler.errorHandler(err);
        }
    );
}

Answer 1

在表单组件中创建subject，并在表组件中订阅该主题。添加用户时发出一个observable。

Answer 2

我刚刚在这里构建了一些代码来演示：https://github.com/DeborahK/MovieHunter-communication/tree/master/MH-Take5

我的用户界面看起来像这样。这是电影，但应该接近你正在做的事情来管理用户：

添加电影时，它会自动显示在左侧列表中。这一切都是通过单个电影数据服务以及getter和setter来完成的。 （没有主题/行为主题。）

Answer 3

当你触发更改检测时，在slibing组件上你可以使用 ngDoCheck lyfecycle hook。

当Angular dirty检查指令时，

ngDoCheck 生命周期钩子。

Code example

Official documentation

但是这个生命周期钩子用于检查Angular不能或不会自己检测的@Input属性的变化。例如，如果将对象传递给输入绑定并在父组件上更改它的属性。和子组件使用 changeDetection：ChangeDetectionStrategy.OnPush

Code example 2