小编ine*_*now的帖子

我正在从事 Angular 9 项目。

我有一个可重复使用的表，现在我有两个（父）组件使用该表。我希望用户能够选择表格上的项目并路由到该项目的详细信息页面。问题是这些表位于两个不同的路由（假设：/lists/parent1和lists/parent2），并且详细信息页面是这些路由的扩展。因此，如果您单击parent1 表的某个项目，则需要转到路线/lists/parent1/details/${id}，如果您使用parent2 的表，则需要转到/lists/parent2/details/${id}。我还通过路由器传递状态数据，并设置 queryParamsHandling。

我认为可以通过多种方式做到这一点，并且我正在尝试找出哪种方法最好。

• 选择 1）当用户单击表中的项目（子组件）时，我会导致表组件发出事件，导致父组件导航到详细信息页面。这是有效的，因为父级知道其当前路线在哪里，所以我可以简单地执行以下操作：

this.router.navigate([`lists/parent1/details/` + row.id], {
      queryParamsHandling: "merge",
      state: { data: row }
    });

在parent1中和在parent2中以同样的方式。缺点是父母双方都使用非常相似的函数（重复的代码？）

• 选择 2）我将当前路由从父组件传递到表（子组件）。这只是一个输入，我将在表组件中使用此函数来导航用户：

goToDetails(row): void {
    this.router.navigate([`${currentRouteInput}/details/` + row.id], {
      queryParamsHandling: "merge",
      state: { data: row }
    });
  }

• Opt3）我在表组件的构造函数中找到当前路径（使用this.router.events），然后设置它并在goToDetails()上面使用的 func 中使用它而不是输入参数。

• 选项4) ??? 出于某种原因，我认为有一种方法可以通过添加到当前路线来简单地进行导航。例如：如果您在路线上，/lists/parent1我认为有一个路由器导航功能router.navigateFromRoute.(['/details/${id}'])，它只会从当前路线导航并添加到它，所以：/lists/parent1/details/${id}。但我看到的唯一路由器导航功能是navigate()和navigateByUrl()。这存在吗？我不知道为什么我这么想。

一种方法比其他方法更好吗？我想让这个表组件保持可重用。此类功能有标准做法吗？

我将不胜感激任何见解和提示，谢谢！

我正在使用 Material 从事 Angular 9 项目。

我这里有一个演示示例：https://stackblitz.com/edit/mat-h ​​int-styling-issue?file=src/app/app.component.html

我正在使用带有垫子提示的输入。通常，mat-h​​int 将包含少量文本，但文本也可能非常大。如果发生这种情况，我想将垫子提示设置为更具响应性。

理想情况下，我希望 mat-h​​int 显示所有文本，但是现在它溢出到下一个输入的顶部。像这样： 相反，我希望它根据需要向下推下一个输入以显示其所有文本。我尝试将显示设为一个块，但没有帮助。

同样重要的是其他垫子提示（“必需！”）不受影响。

如果上述不可能（在不影响“必需！”或大量 scss 的情况下完成），那么我可以满足于在 mat 提示上设置最大高度，并使用省略号控制溢出文本。但是，当我添加最大高度时，文本会被截断，但不会以省略号结尾（即使在有：之后text-overflow: ellipsis）。

有什么样式建议可以使其响应更快吗？感谢您的任何提示或建议。

我正在使用 Material 参与 Angular 11 项目。

我正在使用一些扩展面板。我将在扩展面板的标题中添加一个按钮。因此，我希望仅当单击箭头图标（右侧）时才展开/折叠该行。现在，如果单击标题的任何部分，面板将展开/折叠。

我发现这个帖子：Angular Material Expansion panel, Expand only on button click
但是，该人的解决方案是拥有自己的带有箭头图标的按钮，而不是使用材质面板已有的箭头图标。我宁愿使用面板中材料提供的图标，也不愿创建自己的按钮。

有什么方法可以让我在选择切换图标时向材料发出信号，表明我只想展开？财产还是什么？我认为很多人都希望拥有某种功能...
如果没有，我有办法强制这种行为吗？我不想创建自己的切换按钮，我想使用面板中的切换按钮。

我制作了这个演示，展示了我的问题：https://stackblitz.com/edit/expand-collapse-on-icon-click-only ?file=src/app/expansion-expand-collapse-all-example.html

任何帮助，将不胜感激。

我正在从事 Angular 11 项目。

我知道有 ngIf 指令，如果设置为 true，它只会显示 html 元素，但不会保留间距。

在旧的 AngularJS 中，有 ng-show 和 ng-hide。这些属性将显示/隐藏一个元素，但保持其间距（有效地将 css 设置为可见性隐藏）。但 Angular 不再具有这些属性。相反，他们建议绑定到隐藏属性（https://angular.io/guide/ajs-quick-reference#ng-show）。
然而，这并没有保留间距（在我看来这很奇怪）。
Angular 是否有一个指令可以隐藏元素，同时保留其间距？

我可以添加一个条件类，其中该类的可见性为隐藏，但我试图确认 Angular 是否有这方面的指令/属性。

我在这里擦掉了一个演示：https://stackblitz.com/edit/hide-element-angular
?file=src/app/autocomplete-auto-active-first-option-example.html 这显示了隐藏和 ngIf 没有保留间距，而条件类则保留间距。