AngularDart Material Design 步进器 顶

MaterialStepperComponent

Selector: <material-stepper>

材料设计风格的步进器。

步进器是用于将进度或功能作为导航工具传送的编号指示器

Inputs:

• legalJumps String  跳转（定义为由“继续/取消”按钮触发的步骤开关）是合法的。 可能的值：      'none'（默认值;不允许跳转），      'backwards'（跳到已完成的不允许的步骤），     'all'（允许任何跳跃，无论步进状态如何）。
• noText String 要返回到前一步骤的按钮上显示的文本。 默认情况下，显示“Cancel”。
• orientation String 制定步骤的方向。 可能的值：'horizontal'和'vertical'（默认值）。
• size String  尺寸主题又确定各种步骤标题元素的大小（例如，步骤编号，步骤名称等）。 可能的值：'default'（默认值）和'mini'。
• stickyHeader bool  指示列出可用步骤的标题是否应该粘贴到页面顶部。 仅适用于带水平割台的踏步机。

Outputs:

• activeStepChanged Stream<StepDirective>  活动步骤发生变化时触发的事件。

StepDirective

Selector: <[step]>

导出为：step

步进器内的一个步骤。

Inputs:

• canContinue bool  步骤是否可以继续。 这可以用于防止步骤继续直到当前步骤的所有部分满足验证要求。
• cancelHidden bool  是否应在此步骤中隐藏取消按钮。
• complete bool 步骤是否完成。当步进器进入下一步时设置此项。
• completeSummary String  在垂直默认大小的步进器中完成步骤时显示的摘要文本。对于其他步进器，这不适用。
• hideButtons bool  是否应在此步骤中隐藏按钮。
• name String  名称显示为标题。
• optional bool  步骤是否可选。 可选步骤有一个额外的标签，表示它们是可选的，应该是可跳过的。默认值为false。

Outputs:

• cancel Stream<AsyncAction<bool>>  单击“Cancel ”按钮时调用。 如果事件处理程序调用$ event.cancel（），则不会取消该步骤。
• continue Stream<AsyncAction<bool>>  单击“Continue”按钮时调用。 如果事件处理程序调用$ event.cancel（），则该步骤将不会继续。
• jumpHere Stream<AsyncAction<bool>>  当用户想要跳转到此步骤时调用。 如果事件处理程序调用$ event.cancel（），则该步骤将不会继续。

StepperDemoComponent

查看示例，查看源码。

(adsbygoogle = window.adsbygoogle || []).push({}); function googleAdJSAtOnload() { var element = document.createElement("script"); element.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"; element.async = true; document.body.appendChild(element); } if (window.addEventListener) { window.addEventListener("load", googleAdJSAtOnload, false); } else if (window.attachEvent) { window.attachEvent("onload", googleAdJSAtOnload); } else { window.onload = googleAdJSAtOnload; }