angular2-routing

Angular 2 router event listener

僤鯓⒐⒋嵵緔 提交于 2019-12-17 02:44:13
问题 How to listen state change in Angular 2 router? In Angular 1.x I used this event: $rootScope.$on('$stateChangeStart', function(event,toState,toParams,fromState,fromParams, options){ ... }) So, if I use this eventlistener in Angular 2: window.addEventListener("hashchange", () => {return console.log('ok')}, false); it isn't return 'ok', then change state from JS, only then browser history.back() function run. Use router.subscribe() function as the service: import {Injectable} from 'angular2

How do I create a singleton service in Angular 2?

对着背影说爱祢 提交于 2019-12-16 22:18:06
问题 I've read that injecting when bootstrapping should have all children share the same instance, but my main and header components (main app includes header component and router-outlet) are each getting a separate instance of my services. I have a FacebookService which I use to make calls to the facebook javascript api and a UserService that uses the FacebookService. Here's my bootstrap: bootstrap(MainAppComponent, [ROUTER_PROVIDERS, UserService, FacebookService]); From my logging it looks like

Angular 2: 404 error occur when I refresh through the browser [duplicate]

六眼飞鱼酱① 提交于 2019-12-16 19:55:49
问题 This question already has answers here : Angular 2.0 router not working on reloading the browser (31 answers) Closed 2 years ago . I'm new to Angular 2. I have stored my single-page application in my server within a folder named as "myapp". I have changed the URL in the base to http://example.com/myapp/`. My project have two pages. So I implement Angular 2 routing. I set the default page as login. When I type http://example.com/myapp/ in my browser it will redirect automatically to http:/

Angular 2: 404 error occur when I refresh through the browser [duplicate]

浪子不回头ぞ 提交于 2019-12-16 19:55:06
问题 This question already has answers here : Angular 2.0 router not working on reloading the browser (31 answers) Closed 2 years ago . I'm new to Angular 2. I have stored my single-page application in my server within a folder named as "myapp". I have changed the URL in the base to http://example.com/myapp/`. My project have two pages. So I implement Angular 2 routing. I set the default page as login. When I type http://example.com/myapp/ in my browser it will redirect automatically to http:/

Angular 2 navigate from child to parent

£可爱£侵袭症+ 提交于 2019-12-14 04:19:06
问题 How can i navigate from child: localhost/#/pages/config/out-devices/1000 to parent localhost/#/pages/config/out-devices i tried: back(){ this.router.navigate("../", {relativeTo: this.route}); } in the child Component but get a redirection to default site my routing.ts const routes: Routes = [ { path: 'login', component: LoginComponent}, { path: '', redirectTo: 'login', pathMatch: 'full' }, { path: 'pages', canActivate: [AuthGuard], component: PagesComponent, children: [ { path: '', redirectTo

Angular 2 application not working when moved into IIS virtual directory

爷,独闯天下 提交于 2019-12-14 03:34:36
问题 I have created a Virtual Directory on IIS (inetmgr) on my local PC and later converted it into IIS Web Application. The web application's root is: http://localhost/xyz/ When deployed and ran the application, I get the following error in the browser: All html components 404 not found errors. Added rewrite rules in web.config. I changed index.html's base href to ./xyz or ./ but no luck. If I deploy it to root directory, everything resolves - not sure what's going wrong. 回答1: 1. Enable xyz

Connect Angular routing with MVC routing

戏子无情 提交于 2019-12-14 03:15:43
问题 In my new project in WebApi2 I use Angular2 framework. After configuring and adding angular I tried to call first compnent. And there is my question. How to connect angular routing with webapi2? I add new class where I add routing: I call <home-page> in MVC controller view Index.cshtml app.routing.ts const appRoutes: Routes = [ { path: 'home', component: HomePage }, { path: 'test', component: AppComponent} ]; app.component.ts @Component({ selector: 'my-app', templateUrl: './app.template.html'

Angular2 Routing, heavy page, simulate navigation

风格不统一 提交于 2019-12-14 02:39:00
问题 I need to be some help on routing. Most of it works fine, including back and forward buttons in browser, as long as I am moving between different routes. But I have a heavyweight component (youtube player) (route) that I want to just change the content on /route/:id and avoid re-initializing the component. So I use the Location.go(:id) to fix up the url. But now the back and forward buttons in the browser don't work correctly. I thought I could use Location.subscribe to hook the browser event

Angular 2 navigating in the different instances of the same component with different data to display

三世轮回 提交于 2019-12-14 02:26:35
问题 I have a simple side menu in my Angular 2 applications which display a list of classRoom , each class Room has many users. I navigate between the different instance with routerLink . My problem is that when I click on the first item : -class Room number 1 I have no problem and the list of user are alright, but when I click on Class Room number 2 the data does not change, so the users displayed are the users of Class Room Number 2. How can I tell Angular To re-render the component with the new

Page reloading on child routing

别说谁变了你拦得住时间么 提交于 2019-12-13 17:36:54
问题 Using Angular 2 Router. I have a 2 level routing ( root routing and child routing ] My problem is that when navigating to a child route the page is reloading after the Child is being loaded. child level routing const childRoutes: Routes = [ { path: '', component: BaseComponent, children: [ { path: '', component: DetailsComponent }, { path: 'other', component: OtherComponent } ] } ]; export const childRouting = RouterModule.forChild(childRoutes); Top Level Routing const appRoutes: Routes = [ {