angular 监听路由变化进行事件操作

需要引入的

import { Router, NavigationStart, NavigationEnd  } from '@angular/router';
import { filter } from 'rxjs/operators';

代码操作

export class NewsListPage extends ScrollbasePage implements OnInit {
  public totalNum = 0;  // 总数据条数
  public pageSize = 5; // 每页数条数
  public pageData = this.pageSize;  // 每页数据
  public totalPage = 0; // 总页数
  public curPage = 1; // 当前页码

  news$: Observable<any>;

  constructor(
    private router: Router,
    private newsService: NewsService,
    private location: PlatformLocation
  ) {
    super();
  }

  ngOnInit() {
    this.router.events.pipe(//监听路由代码
        filter(event => event instanceof NavigationEnd)
      ).subscribe((res: any) => {
      this.onUrl();//事件操作
    });
    this.onUrl();
  }

  onPageIndexChange(pageNo) {
    this.curPage = pageNo;
    this.router.navigate(['newslist' , pageNo]);
    this.news$ = this.newsService.getNews(pageNo - 1);
  }
  onUrl() {
    const cur = +window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
    this.curPage = cur;
    this.news$ = this.newsService.getNews(cur - 1);
  }

  goDetail(id) {
    this.router.navigate(['news', 'detail', id]);
  }

}