angular2-routing

router-outlet is not a known element

做~自己de王妃 提交于 2019-12-04 22:50:51
The following code works: /*app.module.ts*/ import { NgModule } from '@angular/core'; import { HttpModule } from '@angular/http'; import { AppComponent } from './app.component'; import { LetterRecall } from './letterRecall/letterRecall.component'; @NgModule({ imports: [BrowserModule, HttpModule], declarations: [AppComponent, LetterRecall], bootstrap: [AppComponent], }) export class AppModule {} /*app.component.ts*/ import {Component} from '@angular/core'; @Component({ selector: 'my-app', templateUrl: 'app/app.component.html' }) export class AppComponent { } /*app.component.html*/ <h3>Title</h3

TypeError: Cannot create property 'validator' on string 'abc@gmail.com' at setUpControl

拈花ヽ惹草 提交于 2019-12-04 22:49:30
I face issue in formGroup . First Based on URL I take some value and call to API for retrieve particular user-data for pre-field text. register.html <form [formGroup]="form" (ngSubmit)="onSubmit(form.value)" class="form-horizontal"> <div class="form-group row"> <label for="inputEmail3" class="col-sm-4 ">Username</label> <div class="col-sm-8"> <input [formControl]="email" type="text" class="form-control" id="inputEmail3" placeholder="Email Address" [readonly]="isReadOnly"> </div> </div> </form> register.component.ts import { Component } from '@angular/core'; import { FormGroup, AbstractControl,

Angular 2 Header component Title change dynamically according to the state

与世无争的帅哥 提交于 2019-12-04 22:24:42
问题 I have a design using angular 2 where header component, navigation bar component and body component where all other components load. As the picture shows below Header Navigation Where other components load (this section might have nested components/ children components) So here basically, In the header component, I want to show the current state . And in the bottom of the current state, I want to show the previous state of the user. Issues: To implement this I used the component interaction

How to hide link by guard angular2

孤者浪人 提交于 2019-12-04 21:55:35
问题 How to hide admin link in view html. I have to guard :Admin and Manager Router config : { path: 'manager', component: ManagerComponent, canActivate: [ManagerGuard] }, { path: 'user', component: UserAdminComponent, canActivate: [AdminGuard] } In view : <li> <a routerLink="/user" routerLinkActive="active-link">User</a> </li> I want to hide link on /user for ManagerGuard when but show for AdminGuard. 回答1: Also if already answered in a way which might be helpful, I used here another approach. As

angular 2 retain state from URL after redirect

半腔热情 提交于 2019-12-04 20:46:00
I start my angular app's index.html file at /app/123 and want to redirect to the controller handling /app with 123 to retain the information about what was queried initially. How can this be accomplished? You have several choices: 1) You can retain information on a route using query parameters. That allows you to pass the same parameters back and forth between components. 2) Alternatively, you can build a service to hold onto your shared data. Services are a great way to hold onto data for your application. (But PLEASE don't use BehaviorSubject. It is completely unnecessary in most scenarios.)

Angular - Animation between pages (after changing route)

为君一笑 提交于 2019-12-04 20:32:28
I'm still new to Angular 2 and was wondering if there is a way to let a component 'fly in' and let another component 'fly out' when switching routes. Let's say I have 2 components: Test1Component and Test2Component and 2 routes pointing to each of them. What would be the best way to do it? https://github.com/angular/angular/issues/9845#issuecomment-235799008 RC5 will hopefully be out this week, if not then next week. For now (with RC5) you will need to do this for every component that is routed to and you want to add animations to: @Component({ host: { '[@routeAnimation]': 'true' }, animations

Angular2 lazy loading a route issue

老子叫甜甜 提交于 2019-12-04 19:20:31
Angular2 lazy loading a route issue. I'm using Angular2, typscript, html5 and systemjs. I'm trying to get lazy loading working for one of my basic routes. This is the blog I'm following but I can't seem to get it working: http://blog.angular-university.io/angular2-ngmodule/ This is the console error I get: Uncaught (in promise): Error: Cannot match any routes. URL Segment: '500' My page is the 500 page. Below I have added my files at there current state. Module for 500 page: import { NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; import { Component500 } from '

Angular 2/4 How to get route parameters in app component?

生来就可爱ヽ(ⅴ<●) 提交于 2019-12-04 17:10:28
问题 As I am new to angular 2/4 I am having trouble setting up a new application as per my need. I am trying to build an application which will be called for from some another application. Calling application will send some parameter like token, username, application id and etc. Now, as in Angular 2/4, app.component is our landing component and every first request will go through it. So, I want to get those parameter here in app component and load some user detail, make a local session and the

Angular guards, unclear statement in the docs

余生长醉 提交于 2019-12-04 16:30:39
问题 I'm trying to understand angular deeply, so i read the docs and it was very helpful. now i'm studying the guards. and i read this statement in the docs. The router checks the CanDeactivate and CanActivateChild guards first, from the deepest child route to the top. Then it checks the CanActivate guards from the top down to the deepest child route. now i'm confused, why does angular perform it in this way? is there any benefits of doing the checking from the deepest child to the top for

Default route redirect not working for lazy loaded routes in Angular 2

让人想犯罪 __ 提交于 2019-12-04 16:18:59
问题 I have an app that is divided into a authenticated section (InternalRootComponent) and an anonymous section (ExternalRootComponent). Everything works fine when I navigate to the routes explicitly, but when I go to the root (/), I don't get redirected. Also, the AccountsComponent is loaded for some reason. app-routing.module.ts: export const routes: Routes = [ { path: '', redirectTo: 'login', pathMatch: 'full' }, { path: 'login', component: ExternalRootComponent, children: [ { path: '',