Angular 项目的实战修改

最近在公司学习的Angualr 项目开始慢慢上手，在修改过程中遇到了一个难以解决的问题，我修改的是账户模块，账户模块点击进入显示账户的详情，在其中点击修改身份，成功会跳转的上个页面。由于account-main和account-detail是写在一个页面，原本这种情况很容易返回只要调用路由返回就可以了。this.router.navigateByUrl('account');

但是前一个写这个页面的人防止HTML代码冗余把account-detail页面当作一个组件写在了account-main中，两个页面的路径是一样的。

<div *ngIf="!isShowAccountDetail; else elseBlock ">....</div> //account-main页面

<ng-template #elseBlock> //account-detail页面
  <WingBlank>
    <app-account-detail [account]="currentShowAccount"
                        (selectAccountEvent)="doDegreeSearch($event)" (isShowAccountDetail)="showDetail()"></app-account-detail>
  </WingBlank>
</ng-template>

这样导致我无法直接调用路由返回，我使用了许多方法最后发现可以通过组件的回调函数也就是上面(isShowAccountDetail)="showDetail()"这个，组件里的回调函数需要自己在里面定义函数写方法。实现的结果就是可以修改完身份自动跳转到上个页面。