在Angular中处理另一个组件内的组件

时间:2019-02-22 10:07:39

标签: javascript html angular typescript jhipster

我正在尝试利用Angular中基于组件的体系结构(CBA)的概念。以下是场景:

我有三个具有不同选择器的组件。现在,在另一个第4组件中,我正在尝试导入它们。这是通过在更高版本的html文件中添加其选择器来完成的。

第四个组件文件:component.html

<component1></component>
<component2></component>
<component3></component>
<component4></component> 

所有子组件基本上都是带有数据的引导表。

此外,我正在使用ngb-pagination在这些组件中提供分页。

现在的问题是,每当我单击排序图标时,页面的控制权就会转移到子组件的URL,这意味着整个页面都会被更改。现在,我们需要再次单击该图标,以使排序出现。

更改页码时,同样的问题仍然存在。可能是因为angular需要组件URL来进行带有可分页选项的get查询。

我正在使用Jhiptser。

请告诉我是否有办法。

以下是屏幕截图:

这是主要组件,具有其他组件,例如部署和部署:

enter image description here

这是子组件。

现在,每当我从主组件页面单击排序按钮(任何按钮)时,第一次单击实际上都不会执行该操作。转到子组件页面。之后,该功能将按预期工作。

1 个答案:

答案 0 :(得分:0)

解决方案非常简单。

Jhipster,默认情况下使用ngb-pagination模块来处理分页。(服务器端)。

使用更流行的模块,例如ngx-pagination即可完成工作。我们需要做的就是简单地添加一些分页控件。

此问题某种程度上与this open issue有关。