防止默认路由 - Angular 2 [英] Prevent Default Routing - Angular 2

问题描述

我如何防止默认 angular 2 中的路由?在 router subscribe 中，我只得到路径名.我没有得到事件.angular 2 中是否还有其他服务提供商来获取路线更改事件?

How can I prevent default the routing in angular 2? In router subscribe, I get only the path name. I am not getting event in it. Is there any other service provider in angular 2 to get the route change event?

app.component.js

(function (app) {

app.AppComponent = ng.core
        .Component({
            selector: 'my-app',
            templateUrl: 'app/views/main.html',
            directives: [ng.router.ROUTER_DIRECTIVES],
            viewProviders: [ng.http.HTTP_PROVIDERS]
        })
        .Class({
            constructor: [ng.router.Router, ng.http.Http, function (router, http) {

                   this.router.subscribe(function (pathname) {
                       //console.log(pathname);
                   });

            }],
        });

ng.router
        .RouteConfig([
          { path: '/login', component: app.LoginComponent, name: 'Login', useAsDefault: true },
          { path: '/todos', component: app.TodosComponent, name: 'Todos' },
        ])(app.AppComponent);

})(window.app || (window.app = {}));

boot.js

(function (app) {

    document.addEventListener('DOMContentLoaded', function () {
        ng.platform.browser.bootstrap(app.AppComponent, [ng.router.ROUTER_PROVIDERS, ng.core.provide(ng.router.LocationStrategy, { useClass: ng.router.HashLocationStrategy })]);
    });

})(window.app || (window.app = {}));

推荐答案

如果你想在纯 JS 中使用 CanActivate 装饰器，请执行以下操作:

If you want to use the CanActivate decorator in plain JS, you do the following:

var Child1Component = ng.core.Component({
  selector:'test',
  template: '<div>Test</div>'
}).Class({
  onSubmit: function(){
    console.log('onSubmit');
  }
});

ng.router.CanActivate((next, prev) => {
  // The Child1Component component is instantiated
  return true;

  // The Child1Component component isn't instantiated
  // return false;
})(Child1Component);

例如，在启动时，prev 参数为空，next 包含以下内容:

For example, at startup, the prev parameter is null and the next one contains the following:

ComponentInstruction {
  urlPath: "child1",
  urlParams: Array[0],
  terminal: true,
  specificity: "2",
  params: Object…
}

这篇关于防止默认路由 - Angular 2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！