Question

我正在开发一个Angular2应用程序。我的应用程序用于创建新帖子或编辑已创建的帖子。它有两页。

第一页，仅仅是具有所有基本信息的普通表格，第二页具有多个将彼此交谈的组件，即每个组件彼此相互链接并且需要彼此交谈。这些组件是动态的，具体取决于类型。

我的问题是：我应该如何构建应用程序的流程，使其适合创建和编辑方案。

我现在想的方式是，

每个组件都有一个服务（使它们可注入），它将保存数据，我必须为所有这些服务创建观察者，并订阅其他组件中的服务，以便它们根据服务的变化采取行动。

其他方式是：

我创建了一个将返回发射对象的公共发射器服务，我可以调用该组件并发出其他组件侦听的事件。

哪种方式可以很好地处理这种情况，并从长远来看有所帮助？另外，应该以某种方式提供帮助，以便以后可以无缝添加更多组件吗？

由于

Answer 1

我会考虑在第二页的ngOnInit方法中创建你需要的'模型'对象，并将它们作为输入传递给需要它们的组件。

这要求组件定义@Input（）属性以接收此类“模型”对象。

我希望这会有所帮助

响应ANUTEJA的评论

我会考虑以下策略：

1）Child1定义了一个输出属性（比如说@Output() resultOutput），它通过它来表示从后端调用中检索到新结果的事实，即this.resultOutput.emit(resultOfBackendCall)之类的东西（假设resultOfBackendCall是Child1检索数据的方法中定义的变量

2）Parent组件订阅resultOutput的{{1}}属性，因此通过类似Child1

的内容知道何时获取新结果

3）<child1 (resultOutput)="newResult($event)"></child1>的{{1}}方法将从newResult(event)收到的结果存储到Parent的属性中（让我们称之为变量Child1），像

Parent

4）resultReceived定义了一个输入属性（假设newResult(resultFromBackEnd) { this.resultReceived = resultFromBackEnd; }），它希望从Child2接收需要显示的列表

5）@Input() myList使用Parent

之类的内容Parent Child2 resultReceived

如果一切正常，只要<child2 [myList]="resultReceived"></child2>收到Parent来自后端的新结果的通知，就会调用它Child1，然后显示结果。

基本上这意味着Child2集中所有通知并根据应用程序规则将数据分发给其子项。这样，在我看来，你获得了一个清晰的设计，Parent编排了这个特定应用程序中发生的事情。

我希望这很清楚，并且有帮助

Angular 2应用程序的架构流程

1 个答案: