我正在构建一个带角度的应用程序。 UX设计师给我的设计并不是传统的响应式网站，因为组件会根据窗口大小在彼此之下崩溃。对于大屏幕和小屏幕，基本上存在整个其他布局。需要在DOM中添加或删除5-10个小组件/指令，然后将站点的2-4个大组件移动到一侧或另一侧或完全删除。这让我想到了我的问题。处理这种情况的正确方法是什么？我查看了@HostListener以编程方式删除或添加项目，具体取决于调整大小事件。我还考虑过使用媒体查询，只是根据屏幕大小隐藏元素。我很想去主机监听器路线，因为隐藏一堆东西或用媒体查询显示它似乎很麻烦。你怎么看？解决这个问题的最佳方法是什么？
答案 0 :(得分：0)
我认为CSS是最简单的解决方案。只需使用媒体调用或使用类似于.hide-sm等类内置的boostsrap之类的东西。
以下是css方法和hostlistener方法的链接（由this answer提供）： https://stackblitz.com/edit/angular-rfttks
如果您愿意，可以使用@HostListeners和*ngIf语句，但对于相同的基本功能而言，这似乎是一项额外的工作。我也不相信通过css隐藏它会有任何实际好处。
要记住的另一件事是为什么。正如我们在评论中所讨论的那样，对于一些选项存在内存和网络含义。另一种可能性是根据屏幕尺寸重新组合组件。
答案 1 :(得分：0)
取决于你想要什么： 1）删除：使用* ngIf 2）隐藏：css - ＆gt;使用不透明度或可见性