Angular 6 导航后重定向回主页

Question

我的 Angular 6 应用程序遇到问题，我成功导航到另一个视图，但随后它自动将我重定向回索引视图。我成功地在屏幕上看到了组件的内容，ngOnInit触发了，我还可以从ActivatedRoute.

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

谁能看到我哪里出错了？提前干杯。

更新1

如果我使用 ana而不是 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

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