angular2-routing | 易学教程

Angular 2 Final Release Router Unit Test

阅读更多关于 Angular 2 Final Release Router Unit Test

问题 How do I unit test routers in Angular version 2.0.0 with karma and jasmine? Here's what my old unit test looks like in version 2.0.0-beta.14 import { it, inject, injectAsync, beforeEach, beforeEachProviders, TestComponentBuilder } from 'angular2/testing'; import { RootRouter } from 'angular2/src/router/router'; import { Location, RouteParams, Router, RouteRegistry, ROUTER_PRIMARY_COMPONENT } from 'angular2/router'; import { SpyLocation } from 'angular2/src/mock/location_mock'; import {

Service is not being singleton for angular2 router lazy loading with loadChildren

阅读更多关于 Service is not being singleton for angular2 router lazy loading with loadChildren

问题 Here is the pluker. https://plnkr.co/edit/tsNlmRth4mRzz0svGWLK?p=preview In which I have created two module with two components and one service each. I want the service should be singleton (save state) in the module level. If you click on 'Module 1 Page 1' and 'Module 2 Page 2' It will display two different random numbers. As I am generating this number in constructor. So the service is being created each time page change. But module2 is behaving perfectly. Note: Mode1Module is using

how to change page title in angular2 router

阅读更多关于 how to change page title in angular2 router

问题 I am trying to change the page title from the router, can this be done? import {RouteConfig} from 'angular2/router'; @RouteConfig([ {path: '/home', component: HomeCmp, name: 'HomeCmp' } ]) class MyApp {} 回答1: The Title service @EricMartinez points out has a setTitle() method - that's all you need to set the title. In terms of doing it automatically on route changes, as of now there's no built-in way of doing this other than subscribing to Router and calling setTitle() in your callback: import

Angular2 router 2.0.0 not reloading components when same url loaded with different parameters?

阅读更多关于 Angular2 router 2.0.0 not reloading components when same url loaded with different parameters?

I have this in my .routing.ts file export const routing = RouterModule.forChild([ { path: 'page/:id', component: PageComponent }]); My PageComponent file checks the id parameter and loads the data accordingly. In previous versions of the router, if i went from /page/4 to /page/25, the page would "reload" and the components would update. Now when i try navigating to /page/X where X is the id, it only ever loads the first time, then the url changes, but the components do not "reload" again. Is there something that needs to be passed in to force my components to reload, and call the ngOnInit

Angular2: Make route paths case insensitive

阅读更多关于 Angular2: Make route paths case insensitive

I have the following routing configuration. @RouteConfig([ { path: '/home', name: 'Homepage', component: HomepageComponent, useAsDefault: true } ) export class AppComponent { } whenever the browser is pointed to /home this route works but not for /Home or any other case variations. How can I make the router to route to the component without caring the case. thanks Here's what I did. import { DefaultUrlSerializer, UrlTree } from '@angular/router'; export class LowerCaseUrlSerializer extends DefaultUrlSerializer { parse(url: string): UrlTree { // Optional Step: Do some stuff with the url if

How to route to a Module as a child of a Module - Angular 2 RC 5

阅读更多关于 How to route to a Module as a child of a Module - Angular 2 RC 5

问题 I am in the process upgrading an application I'm working on to the latest Angular 2 release candidate. As part of this work I am attempting to use the NgModule spec and migrating all of the parts of my application to modules. For the most part, this has gone very well with the exception of an issue with routing. "@angular/common": "2.0.0-rc.5", "@angular/compiler": "2.0.0-rc.5", "@angular/core": "2.0.0-rc.5", "@angular/forms": "0.3.0", "@angular/http": "2.0.0-rc.5", "@angular/platform-browser

Angular 2 - Routing - CanActivate work with Observable

阅读更多关于 Angular 2 - Routing - CanActivate work with Observable

问题 I have an AuthGuard (used for routing) that implements CanActivate . canActivate() { return this.loginService.isLoggedIn(); } My problem is, that the CanActivate-result depends on a http-get-result - the LoginService returns an Observable . isLoggedIn():Observable<boolean> { return this.http.get(ApiResources.LOGON).map(response => response.ok); } How can i bring those together - make CanActivate depend on a backend state? 回答1: You should upgrade "@angular/router" to the latest . e.g."3.0.0

How can I improve load performance of Angular2 apps?

阅读更多关于 How can I improve load performance of Angular2 apps?

问题 Angular2 app is loading slow, how can I improve the performance on load? I use Angular2, typescript with html5. currently my app takes 4 seconds to load. I host with Firebase and use cloudflare. Things I'm doing / info: I've compressed images. I minify css I minify js. I use async on my scripts. My scripts are in my . The scripts are around 700kb I used google speed test and get 65% I used minified version of the libs I use e.g. bootstrap etc. Using systemjs. This is the seed app im using:

Change route params without reloading in angular 2

阅读更多关于 Change route params without reloading in angular 2

I'm making a real estate website using angular 2, google maps, etc. and when a user changes the center of the map I perform a search to the api indicating the current position of the map as well as the radius. The thing is, I want to reflect those values in the url without reloading the entire page. Is that possible? I've found some solutions using AngularJS 1.x but nothing about angular 2. Pankaj Parkar You could use location.go(url) which will basically change your url, without change in route of application. NOTE this could cause other effect like redirect to child route from the current

Angular2 without hash in the url

阅读更多关于 Angular2 without hash in the url

问题 Now, my website's url looks like this because I'm using the approach described here http://localhost:4200/#/cadastro Is it possible to remove the hash in the url and not get the 404 error? EDIT: Router Module added const appRoutes: Routes = [ { path: '', component: HomeComponent }, { path: 'cadastro', component: CadastroNoivosComponent }, { path: '**', component: HomeComponent } ]; export const routing = RouterModule.forRoot(appRoutes); 回答1: If you use PathLocationStrategy as describe here