导航后Angular 6重定向回主页

Question

我在我的 Angular 6 应用程序中遇到了一个问题，我成功地导航到另一个 View ，但它会自动将我重定向回索引 View 。我成功地在屏幕上看到组件的内容，ngOnInit火灾，我也可以从 ActivatedRoute 中获取路由参数.

如果我在地址栏中手动输入 URL，它不会导航回主页。

谁能看到我哪里出错了？提前加油。

更新 1

如果我使用 a而不是 button ，它不会重定向。

<!-- this will cause the route to redirect back -->
<button 
  class="btn btn-default btn-sm pull-right"
  [routerLink]="['/destination', _destination.placeId]">
  Edit...
</button>

<!-- This works! -->
<a 
  class="btn btn-default btn-sm pull-right" 
  [routerLink]="['/destination', _destination.placeId]">
  Edit (LINK)
</a>

app.module.ts - 路线

RouterModule.forRoot([
  { path: '', component: HomeComponent, pathMatch: 'full' },
  { path: 'destination/:id', component: EditDestinationComponent }
], { enableTracing: true })

导航触发器

<button 
  class="btn btn-default btn-sm pull-right"
  [routerLink]="['/destination', _destination.placeId]">
  Edit...
</button>

编辑-destination.component.ts

@Component({
  selector: 'app-edit-destination',
  templateUrl: './edit-destination.component.html',
  styleUrls: ['./edit-destination.component.css']
})
export class EditDestinationComponent implements OnInit {

  constructor(
    private route: ActivatedRoute
  ) { }

  ngOnInit() {
    console.log('loaded edit-destination');
    this.route.paramMap
      .pipe(
        tap((params: ParamMap) => console.log(`destination: ${params.get('id')}`))
      )
      .subscribe();
  }

}

编辑-destination.component.html

<p>
  edit-destination works!
</p>

路由器跟踪

Answer 1

就我而言，我在标记中使用了表单标签，所以我认为当用户单击按钮时它会触发“表单发布”。添加 返回假； 在 的最后一行代码点击 事件解决了问题。