angular2-routing

Get route query params

[亡魂溺海] 提交于 2019-11-27 09:04:57
I am trying to migrate from rc1 to rc4 and i have trouble getting query string parameters. ActivatedRoute object always empty. hero.component.ts import {Component, OnInit} from "@angular/core"; import {Control} from "@angular/common"; import {ROUTER_DIRECTIVES, ActivatedRoute} from '@angular/router'; @Component({ template: '../partials/main.html', directives: [ROUTER_DIRECTIVES] }) export class HeroComponent implements OnInit { constructor(private _activatedRoute: activatedRoute) { } ngOnInit() { this._activatedRoute.params.subscribe(params => { console.log(params); }); } } main.ts import

New Angular2 router configuration

南笙酒味 提交于 2019-11-27 08:47:46
Back when using the deprecated router I was able to do a router.config and pass in an object. Thing is, the router itself got configured a bit after the app was started, the object had the same "template" as if I'd used the @RouterConfig. What I'm looking for is if there is a way to config the new router like this. Been looking through the documentation but I'm a bit at a loss since it isn't documented yet. Edit due to answer No, I can't use @Routes. Thing is I'm loading the configuration after the construction of the router. Here is a snipped of how I did it with the old router: myLoader

Angular2 router in one component

浪子不回头ぞ 提交于 2019-11-27 08:45:09
问题 I write Angular2 app with router like /main /item . App have a lot of filter tables/trees/combobox. I want in /main page open bootstrap modal window (for example call @component modalFilterWindow) and switch content in this window like router. I can do it like <first-filter-content ngIf="currentFilter=='first'"> <second-filter-content ngIf="currentFilter=='second'"> .... but it can be made more beautiful ...modal window <router-outlet></router-outlet> and switch in modalFilterWindow content

Autoscroll in Angular 2

蓝咒 提交于 2019-11-27 08:17:25
I'm experiencing an issue with Angular 2 where changing from one route to another does not automatically scroll to the top of the new view. I realize that Angular 1 allowed for an autoscroll property to be added to an HTML element, and others had come up with some simple javascript (such as window.scroll(0, 0) ) to force views to scroll to the top when loaded. However, I am not sure how to accomplish this with Angular 2. Does anyone know how to achieve this? Günter Zöchbauer update Currently there is no automatic way. See also Angular 2 typescript error when using subscribe function on new

Angular 2 RC1 Router doesn't work without any routerLInk

大兔子大兔子 提交于 2019-11-27 08:07:05
问题 i have serious problem with angular 2 (RC1) router. This code works: <a [routerLink]="['/anythingEvenNotExistingRoute']"></a> <router-outlet></router-outlet> This doesn't: //<a [routerLink]="['/anything']"></a> <-- without this line in html template <router-outlet></router-outlet> ...so it looks like angular router needs atleast one routerLink in html template.. thats pretty strange.. 回答1: This is currently a bug present in the Angular 2 RC Router https://github.com/angular/angular/issues

Angular 2 typescript error when using subscribe function on new router (rc 1)

我的梦境 提交于 2019-11-27 07:53:14
问题 I am trying to set up authentication for my Angular 2 app with the new router. Someone suggested to try the following: constructor (private _router: Router) {} ngOnInit(){ this._router.subscribe( next => { if (!userIsLoggedInOrWhatever) { this._router.navigate(['Login']); } } ) } This problem however is that this results in the typescript error (app.component.ts(47,22): error TS2339: Property 'subscribe' does not exist on type 'Router'. This is strange because the documentation clearly shows

Angular2 router, get route data from url, to display breadcrumbs

不问归期 提交于 2019-11-27 07:38:01
I am using angular2 router . To draw the breadcrumb of an url, lets say site.com/a/b/c/15 I do the following: Get the route of site.com/a/b/c/15 and get the pretty name associated to the route Get the route of site.com/a/b/c and get the pretty name associated to the route Get the route of site.com/a/b and get the pretty name associated to the route Get the route of site.com/a and get the pretty name associated to the route So lets say I do have the following routes: { path: 'a', component: A, data:{prettyName: 'I am A'}} { path: 'b', component: B, data:{prettyName: 'I am B'}}, { path: 'c',

Angular 2 router resolve with Observable

不问归期 提交于 2019-11-27 07:15:51
After release of Angular 2 RC.5 there was introduced router resolve. Here demonstrated example with Promise, how to do the same if I make request to server with Observable? search.service.ts ... searchFields(id: number) { return this.http.get(`http://url.to.api/${id}`).map(res => res.json()); } ... search-resolve.service.ts import { Injectable } from '@angular/core'; import { Router, Resolve, ActivatedRouteSnapshot } from '@angular/router'; import { Observable } from 'rxjs/Observable'; import { SearchService } from '../shared'; @Injectable() export class SearchResolveService implements Resolve

Angular 2 : multiple HTML pages within same component

丶灬走出姿态 提交于 2019-11-27 06:46:07
问题 I am new to angular 2, I have a component named Register, in this 1 component I have 5 HTML pages where one click of 1st register page I will go to the 2nd register page and on click of 2nd register page I will go to the 3rd register page. How can I make 5 HTML pages in 1 component I means is there a way to achieve multiple templates per component? How to do routing? The main intent is to have separate HTML & SCSS files and routing logic. As of now I am rendering pages using ngIf which has

In Angular 2 how do I assign a custom class to an active router link? [duplicate]

﹥>﹥吖頭↗ 提交于 2019-11-27 06:21:53
问题 This question already has an answer here: Changing the default name of “router-link-active” class by writing a custom directive that adds new class 2 answers Given a routing link: <li [routerLink]="['Main']"><a>Main page</a></li> The framework automatically assigns the class router-link-active when the path matches the route named "Main". What if I wanted to give it a custom class (possibly without injecting Location or any other service in the controller)? 回答1: AFAIK this isn't supported