【问题标题】:Angular2 Route eventsAngular2 路由事件
【发布时间】:2016-01-25 16:34:47
【问题描述】:

我正在使用 Angular2 路由,当路由更改时我需要订阅一个事件。 (即用户点击了其中一个路由链接)。重要的是事件应该是在新视图 HTML 插入到 DOM 时发生。

有没有像 onNavigating 和 onNavigated 这样的事件,所以我可以订阅? 我在 stackoverflow 上找到了几个示例并尝试使用它们(请参阅下面的构造函数),但这不起作用。有什么想法吗?

/// <reference path="../../typings/tsd.d.ts" />

import {Component, View} from 'angular2/angular2';
import {RouteConfig, Router, RouterOutlet, RouterLink} from 'angular2/router';

@RouteConfig([...])

@Component({
selector: 'app'
})
@View({
directives: [RouterOutlet, RouterLink],
template: `
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header">
  <div class="mdl-layout__header-row">
    <span class="mdl-layout-title">Test</span>
    <div class="mdl-layout-spacer"></div>
    <nav class="mdl-navigation mdl-layout--large-screen-only">
      <a class="mdl-navigation__link" [router-link]="['/routelink1']">routelink1</a>
    </nav>
  </div>
</header>
<main class="mdl-layout__content" style="padding: 20px;">
  <router-outlet></router-outlet>
</main>
</div>
`
})
export class App {
constructor(private router: Router){
      router.subscribe((val) => function(){...}); //here is I need to process HTML
   }
}

【问题讨论】:

标签: javascript routes angular


【解决方案1】:

我最终得到了路由组件的基类,它包含 routerOnNavigate 覆盖。

import {OnActivate, ComponentInstruction} from 'angular2/router';

export class BaseView implements OnActivate {

  routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
     componentHandler.upgradeDom();
  }

}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-12-03
    • 1970-01-01
    • 2018-03-03
    • 1970-01-01
    相关资源
    最近更新 更多