将输入数据传递到延迟加载的Angular模块

Question

我有一个名为NewsComponent的组件，它在我的应用程序中共享。我想将它扩展为NewsModule并添加一个路由系统来显示单个文章，以便我的路线看起来像

/some-component
/some-component/news
/some-component/news/article/12345
/other-component
/other-component/news
/other-component/news/article/23456

为了使它的路线相对，我懒惰加载模块：

const routes: Route = [
  {
    path: 'some-component',
    component: SomeComponent
  },
  {
    path: 'some-component/news',
    component: SomeNewsWrapperComponent,
    children: [
      {
        path: '',
        loadChildren: './news/module#NewsModule'
      }
    ]
  }
  // same for /other-component
]

问题是NewsComponent根据一些输入数据显示视觉效果，而我曾经通过@Input传递它。但是现在该组件被封装在其延迟加载的模块中，这已不再可能。

我可以在导入NewsService和NewsModule的第三个模块中创建一个AppModule并以这种方式传递数据，但我觉得这是模块化的破坏并且想要避免它。对于单向数据流进入模块是否有更好的解决方案？

Answer 1

我认为除了这两种方法之外，没有办法传递数据（如果你懒加载）。

1. 使用查询参数
2. 拥有共享服务

根据我的理解，模块化就是关于你的设计。如果你有大量数据要传递给你的延迟加载模块，那么你肯定应该把你的模块弄错了。当您加载延迟时，您应该传递最少量的信息，以便这些信息可以通过某些查询参数传递。

如果您有共享服务，是的，它是解决上述问题的解决方案，但是，它也违反了模块化，但这是一个设计问题。在最合适的级别使用延迟加载使设计完美，并且在模块化方面没有任何问题。