问题标签 [angular-material-stepper]

我使用 matStepper，当我将 selectedIndex 设置为 3 时，我无法使用下一个和上一个导航。我可以单击水平步进器中的 (1)，然后像往常一样使用下一个/上一个。所有表格均有效，单击 (1) 后，我可以使用 1-7 中的下一个进行导航。

注意我有 this.selectedIndex = 3; 硬编码

问题在 stackblitz 中重现

https://stackblitz.com/edit/angular-syml71?file=app/create-profile.component.html

我正在尝试将 amaterial-stepper与 AngularDart 中的表单结合起来。只要表单中缺少一些必需的输入，就应该禁用材料步进器的继续按钮。表单完成后，继续按钮应触发表单上的提交。

但是，由于 step 是一个模板，它会创建自己的范围，并且form不能在此范围之外使用对的引用。因此，以下代码将不会编译并出现错误The getter 'form' isn't defined for the class...。

是否有其他方法可以访问表单或其他解决方案来完成相同的行为？

我有一个使用 Angular Material Stepper 组件的应用程序。

<mat-horizontal-stepper>

如何在没有 CSS-hacks 的情况下禁用逐步点击选项卡上的“涟漪”行为？

谢谢！

根据我的用户界面，情况与这个问题完全不同

如何在步进器中提交表单

我的情况是我必须创建一个具有多种形式的步进器。以便。我已将每个表单分配到各个组件中。而且，我的按钮应该在步进器组件中，每个表单组件只有一个。每当我提交表单时，我都会单击步进提交按钮，这将保存表单。因此，我使用 EventEmitter 从 stepper 组件中捕获 ngSumbit。但这给了我 ngSubmit 未定义的错误。我parent.stepper.component.html的是

这是我的父组件。而Child属于所有形式。喜欢

和 Parrent Stepper 组件，我使用上面的一个 Save 按钮来提交孩子的 From 使用ngSubmit.emit()这个按钮

我孩子的一个形状看起来像child1form.component.html

该child1.component.ts文件是

所有子表单都是相似的。所以我没有在这里写其他子组件。我的问题是，每当我从 中单击保存按钮时parent.stepper.component.html，都会出现错误ngSubmit is undefined。有人可以指导我解决这个问题吗？

谢谢

我正在使用Angular Material Stepper组件。

在我的内容中，我有单独的按钮，可以帮助用户在当前步骤中的任务完成后进入下一步。

我想通过单击步进器组件的步骤按钮来防止用户访问后续步骤。

但是，我希望用户能够通过步进器组件的步进按钮返回上一步。

我没有在步进器内使用表单。我已经看到了组件的 Linear 属性，但它不符合我的要求。

简而言之，通过单击步进器组件的步骤按钮，防止用户进入“未访问”步骤。

This is my form group. I'm using a form group inside another one:

Here is template:

This is the Angular Material documentation for single forms:

I want to use shopGroup on first step, then use address (group inside shopGroup) on second step. Finally, i want to send shopGroup. I'm aware that I need to set type="button" between steps, and type="submit" on the end, however i'm not sure how to set [stepControl] to move from one step to another one. How to make it work on template (html)?

我在我的项目中使用角材料。我使用了侧导航栏和步进器，但它们看起来不像在演示中那样。我在 scss 文件中导入了所需的 CSS 主题。请找到以下代码，

formstepper.component.html

formstepper.component.scss

formstepper.component.ts

应用模块.ts

Sidenavbar 和 stepper 显示在浏览器中，但缺少样式。它们是非常基本的组件。我在这里缺少什么？

我想要多条错误消息，但不知道该怎么做..？在这里，我需要分别验证每个步骤，这就是我使用此步进器的原因

表单生成器是：-

//这是必填栏

// 提供的电子邮件无效

Angular 6 应用程序

stepper.component.html,

stepper.component.ts,

上面的代码，将设置当 stepIndex 属性为 2 时选择的前两个步骤。

我想根据当前选择的步骤重置前进/后退步骤

• If current step is 2. When step 1 is selected, I want to deselect/reset the step 2.

• If current step is 1. When step 3 is selected, I want to set selected state for Step 2 also.

我有一个具有固定步数的 Angular Material Stepper 组件。我希望能够根据条件是真还是假来隐藏步骤。

我首先使用*ngif指令尝试了这个，它工作得很好，直到我意识到它从步进器数组中删除了这些步骤。这不好，因为我需要步进器数组与后端逻辑中的数组匹配。

因此，我没有完全从 DOM 中删除这些步骤，而是决定只[hidden]="!myCondition"在<mat-step>. 这不起作用。它永远不会隐藏步骤，因为步骤继承display: block;自<mat-vertical-stepper>

有没有办法在不完全隐藏整个 Stepper 的情况下覆盖这种行为？或者有没有其他方法可以做到这一点？