Angular 如何将形状分成几个部分,使它们一个接一个

Angular 如何将形状分成几个部分,使它们一个接一个,angular,angular-forms,angular-animations,Angular,Angular Forms,Angular Animations,我正在构建angular项目,希望在几个部分中实现注册,以实现一个接一个。注册需要大约10个字段,为了看起来更好,我想将输入字段分组。所以,当您输入第一组中的所有字段时,单击底部的按钮,第一组“消失”,第二组出现,依此类推。当然,最后所有输入的数据都应该可用,以便可以检查并发送到数据库中 现在,我认为它可以通过角度动画来完成,但这要求每个组都应该在它自己的组件中,或者我错了? 我尝试过使用ng引导转盘,但无法使其工作 如果您有任何新的建议和帮助,我们将不胜感激。您可以通过路由来完成 定义要在其中

我正在构建angular项目,希望在几个部分中实现注册,以实现一个接一个。注册需要大约10个字段,为了看起来更好,我想将输入字段分组。所以,当您输入第一组中的所有字段时,单击底部的按钮,第一组“消失”,第二组出现,依此类推。当然,最后所有输入的数据都应该可用,以便可以检查并发送到数据库中

现在,我认为它可以通过角度动画来完成,但这要求每个组都应该在它自己的组件中,或者我错了? 我尝试过使用ng引导转盘,但无法使其工作


如果您有任何新的建议和帮助,我们将不胜感激。

您可以通过路由来完成

定义要在其中显示注册信息的路由器出口。然后转到第一组问题。单击“发送到第二组问题”

对于路由,每组问题将是一个单独的组件

我在这里做了类似的事情(但使用了标签):

以下是管线定义的示例:

  {
    path: ':id/edit',
    component: MovieEditComponent,
    children: [
      { path: '', redirectTo: 'info', pathMatch: 'full' },
      { path: 'info', component: MovieEditInfoComponent },
      { path: 'tags', component: MovieEditTagsComponent }
    ]
  }
在这里,我分为两个选项卡:信息和标签。但是您可以只使用表单(而不使用选项卡)进行路由