-1

根据我对组件之间数据通信的理解，我们可以通过@input()、@output() 以及制作一个通用的广播服务来实现。

我相信服务是 @input 和 @output 的最佳方式，具体取决于各种条件，例如

  1. 文件夹结构应该像嵌套结构一样处于父子模式。

  2. 我们不能将@output 用于正在处理的组件，因为我们从未找到它的选择器。

  3. 我们也不能将@input & @output 用于非父/子组件。

所以更好的是做一个通用的通信服务，这样我们甚至可以在同级组件（​​不是父子）和子父组件之间进行通信。

所以请我需要你所有的意见，我在这里还是更好的方式？

4

3 回答 3

1

阿克谢，你是对的。这实际上取决于情况。

  1. 当您使用@Input 和@Output 装饰器的父子关系是不错的选择。
  2. 当您有深层嵌套对象并且还想检测更改时，请避免使用 @Input。Angular 不会使用带有深层嵌套对象的 @Input 装饰器来检测更改。在这种情况下，服务是最好的。
  3. 当你想操作数据时，你可以使用服务。以便另一个组件以它想要的方式获取数据。
  4. 您还可以使用 Redux 的概念，使用 NGRX 商店在应用程序的任何地方共享。
  5. 另一种方法是使用 @ViewChild 装饰器。

通过练习，您将了解在哪里使用哪种方法。

于 2019-06-13T10:35:43.970 回答
1

如果 2 个组件之间没有关系（父子或子父），则不能在两个组件之间使用 @input 或 @output 共享数据。对于这种情况，您可以使用公共服务，调用公共服务的函数，在此函数“$next”中使用服务变量，并在要使用的第二个组件中编写该公共服务变量的“$subscribe”。

// calling common service method and pass data to used by component 2 from component 1
this.commonService.method(data);

// common service variable
private variable1 = new Subject<any>();
variable1$ = this.variable1.asObservable();

// common service method
method(data: any) {
    this.variable1.next(data);
}



// passing and calling itself in component 2
 this.commonService.variable1$.subscribe(data => {
        if (data) {
           // use data send from component 1
        }
    });
于 2019-06-13T10:44:39.157 回答
0

您应该考虑的条件：组件是否可重用？

我的建议是在您确定可重用组件之前不要开始实施您的应用程序。

在过程或识别中考虑如何使用组件？如果跟踪通信切换到服务变得复杂，则从 () 输出开始。

如果组件将仅被一个父组件使用，则使用 () 输出，则不需要服务。

此外，当您有深层嵌套对象并且还想检测更改时，请避免使用 @Input。

于 2021-05-22T20:03:03.907 回答