问题标签 [angular-material-stepper]

我一直在为我的一个网页开发一个步进器元素，并尝试实现该功能，以便使用材料设计文档（ https://material.angular.io/components/.reset()）将表单恢复为空白状态步进/概述）

在多表单组示例之后，我可以看到 .reset 通过让您回到第一步并清除表单来正常工作。但是，在尝试使用单一表单结构时，我发现这stepper.reset()会让您回到第一步，但并没有清除表单。

我尝试将重置按钮标记为Type="button"因为单个表单需要在“下一步”和“后退”按钮上进行标记，以防止在单击按钮时提交表单，但没有看到任何更改。

我希望在单击重置时同时执行这两种操作，但我不确定是否必须编写手动重置功能或者我的代码中是否存在错误。

对此的任何帮助将不胜感激。谢谢！

create.component.html

创建.component.ts

您好，我遇到了动态步进器的问题，我尝试为每个步骤生成带有表单的步骤。Forms 来自嵌套的 FormGroup 对象。场景继续：

形式：

步进器.html

我已经工作过 html，但结构不适合步进器。这是工作示例，在 [...] 中是控件

您对如何实现这一目标有任何想法吗？我考虑过ng-template使用模板别名来生成步骤。问候！

编辑：没有嵌套形式，我的步进器看起来像这样，我想它更容易维护：

我有一个 Angular 6 应用程序，它具有使用 @angular/material 水平步进器的不同组件（屏幕），每个步骤都有复杂的表单（模板驱动的表单和表单组），我想将整个步骤保存在草稿中（可能在 localStorage 或mongodb）如果该过程未完成或者用户想要保存以便以后继续，但是所有组件结构都不同，因为它们具有不同的表单组和类成员变量所以我要问的是有什么解决方案可以保存整个带有数据的步进器或整个角度组件，因此当用户想要使用时将继续该过程而不会丢失他/她的数据？

注意：所有组件都有不同的变量，这些变量在表单填写期间会发生变化，有些用于隐藏 app/formControls 的某些部分。

我尝试在我的项目中仅使用 flex-layout 并避免使用 vanilla css。我无法弄清楚如何将水平角度材料步进器居中并获得良好的视野。我检查了一下margin: 0 auto;，它工作正常。这是我的代码：

问题截图：

我已经创建了 6 个阶段的垫子步进器。第 6 阶段是提交。每个阶段由 7 个输入值组成，并设置在特定的表单组和表单控件下。@ 第 6 次提交对象将作为每个组单独出现，希望将数据作为所有表单组的单个对象发布。

使用以下数据值创建了一个步进步骤

组件级别

HTML

正如预期的那样，这些步骤将作为 DEV-TEST-UAT-PROD 出现，但问题是所有步骤都具有相同的表单数据。我想用单独的表单组数据发布每个步骤。任何人都可以帮助如何实现这一目标

如果添加另一个步骤，它会增加步骤级别。

我正在做一个带有角材料的垂直步进器。问题是这个步进器将每个步骤的内容放在步骤标题下方，所以如果有很多步骤，它看起来很糟糕，因为你必须滚动。

我的想法是将标题与内容分开，这样它看起来更像是一个sidenav，但具有角度材料功能。

这是我现在所拥有的： 实际的步进器，内容显示在标题下方

这里有我想要 的步进器，其中内容位于页面中心，步骤标题位于侧面

我尝试过像这样编辑标题：

但它不起作用。

我正在尝试在我们的应用程序中实现 Angular Material Stepper 功能。根据此处的文档，我提出了以下解决方案：

civilliability-proposal-detail.component.html

civilliability-proposal-detail.component.ts

civilliability-step1.component.html

基于此，我得到了一堆错误，我认为这些错误与我在表单中使用子组件的事实有关，但我不太确定如何解决这个问题。那么，有什么建议吗？

我也读过有人没有在步进器中使用formArrayName，但我似乎再也找不到这个例子了，所以无法测试它是否有效。

我正在使用线性垫步进器。

它适用于下一个。我做 api 调用 & 如果它成功然后我调用 stepper-next 事件而不是使用 matStepperNext 指令。

现在，当用户在第 1 步填写所有数据并直接单击下一步标题 r 中的其他步骤（或任何其他编辑记录模式）时，由于表单有效，它将重定向到下一步。

我想在此之前进行服务调用并防止步骤更改，直到服务调用成功然后它才应该重定向到下一步，否则它不应该。

我在文档中找不到任何实现此功能的方法。

谁能建议我该怎么做。我不想禁用标题点击。

我正在使用角度 7 中的 CDKStepper 创建自定义步进器，

我在用

并在步进模板中 - 用于导航，我正在使用

并在 Component.ts

如何获取存储在中的标题<ng-template cdkStepLabel>Fill out your name 1</ng-template>？