标签: angular2-routing

Angular2获取当前路由的别名

我能够获得当前路径的路径,例如:/ about,/,/ news with location.path().但是我怎样才能得到它的别名(路由定义中的'as'部分)?

{ path: '/about', as: 'About', component: About }
Run Code Online (Sandbox Code Playgroud)

可能吗?

angular2-routing angular

13
推荐指数
1
解决办法
2万
查看次数

Angular2:如何在使用angular2路由时找出上一页的URL

我正在开发一个angular2应用程序,我使用路由器.我在页面/ myapp /注册.注册后,我将使用导航到/ myapp/login./ myapp/login也可以从我的主页/ myapp导航.所以现在,当用户users/myapp/login我回去了.这可以通过使用location.back()来完成.但是当用户来自/ myapp/signup时,我不想回去.所以我应该检查用户是否来自/ myapp/signup,如果是,我想将它指向其他地方.我如何才能知道以前的网址,以便根据具体情况将用户定向到特定状态?

angular2-routing angular

13
推荐指数
2
解决办法
3万
查看次数

使用angular2中的app.component.html中的*ngIf更改路由器插座

我正在使用角度2.0决赛.我正在尝试更改主app.component.html中路由器插座的位置.模板正在更新精细显示,除了,我第一次使用router.navigate组件将不会显示在新的路由器插座中,并且没有错误.第二次和每次使用router.navigate后它都能正常工作.

app.component.html的示例模板

   <div *ngIf="authenticated() == false">
      <h1>not logged in</h1>
      <router-outlet>
      </router-outlet>
    </div>
    <div *ngIf="authenticated()">
      <h1>logged in</h1>
      <router-outlet>
      </router-outlet>
    </div>
Run Code Online (Sandbox Code Playgroud)

angular2-template angular2-routing angular

13
推荐指数
2
解决办法
9513
查看次数

EXCEPTION:未捕获(承诺):错误:找不到模块'app/home/home.module'

我正在尝试使用路由器延迟加载Angular 2模块,我遇到了这个错误:

error_handler.js:50 EXCEPTION:未捕获(在承诺中):错误:找不到模块'app/home/home.module'

我尝试了所有似乎对其他人有用的答案,比如这个似乎是每个人都面临这个问题的解决方案,但是不适用于我在Angular2 RC7和angular-cli webpack中加载Lazy

这是我的代码:app.module

import { MediatorService } from './home/mediator.service';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';


import appRoutes from "./app.routes";


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    appRoutes
  ],
  providers: [MediatorService],
  bootstrap: [AppComponent]
})
export class AppModule { }
Run Code Online (Sandbox Code Playgroud)

app.routes

import { RouterModule } from …
Run Code Online (Sandbox Code Playgroud)

lazy-loading webpack-dev-server angular2-routing angular-cli angular

13
推荐指数
6
解决办法
3万
查看次数

Angular2路由器:错误:无法找到加载'InboxComponent'的主要插座

我用路由创建了一个简单的应用程序 链接" http:// localhost:4200 "和" http:// localhost:4200/mail "运行良好,

但是当我尝试打开一个链接" http:// localhost:4200/mail/inbox "时,我收到一个错误:"找不到加载'InboxComponent'的主要插座".

是什么导致错误,我该如何解决?

这是我的*.ts文件:

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { MailListComponent } from './components/mail-list/mail-list.component';
import { FoldersComponent } from './components/folders/folders.component';
import { InboxComponent } from './components/inbox/inbox.component';

const routes = [
  { path: '',
    component: MailListComponent
   }, …
Run Code Online (Sandbox Code Playgroud)

typescript angular2-routing angular2-router angular

13
推荐指数
2
解决办法
2万
查看次数

Angular 2如何在同一路径上应用具有Or-Relationship的多个防护

我的应用程序允许基于用户角色访问内容.我为每个角色写了一个Router Guard.某些内容允许访问role1或role2或role3.我应该如何在feature-routing.module.ts文件中编写canActivate声明?据我了解,如果我写

canActivate:[Role1Guard, Role2Guard, Role3Guard]
Run Code Online (Sandbox Code Playgroud)

如果任何警卫返回false,则拒绝访问.但在我的情况下,如果任何一个守卫返回true,我应该允许访问.怎么做?提前谢谢了!

angular2-routing angular2-guards angular

13
推荐指数
1
解决办法
4136
查看次数

在IIS上托管的Angular 2:HTTP错误404

我有一个简单的应用程序,其中一个组件需要来自url的某些参数.应用程序中只有一条路线:

const appRoutes: Routes = 
                       path: 'hero/:userId/:languageId',component: HeroWidgetComponent }];
Run Code Online (Sandbox Code Playgroud)

在Index.html中,我在标题中有这个 <base href="/">

我正在使用webpack,并且在浏览url时,应用程序在开发环境中运行良好:http://localhost:4000/hero/1/1.

但是,在构建用于生产的应用程序并获取分发文件时,请在IIS上托管该应用程序.尝试浏览同一个网址时出现以下错误:

HTTP Error 404.0 - Not Found
The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.
Run Code Online (Sandbox Code Playgroud)

如果我删除所有路由并只http:localhost:4200在IIS上浏览:该应用程序工作正常.

iis http-status-code-404 angular2-routing angular

13
推荐指数
3
解决办法
1万
查看次数

Angular router.navigate()delta

如手册中所述,router.navigate接受delta,但是手册但是不够具体:

根据提供的命令数组和起点进行导航.如果没有提供起始路线,则导航是绝对的.

...

与navigateByUrl相反,navigation始终采用应用于当前URL的增量.

它只是应用相对URL还是更复杂的东西?那么在绝对导航的情况下,它指的是什么样的三角洲呢?

angular2-routing angular

13
推荐指数
1
解决办法
779
查看次数

使用自定义匹配器限制路由

我有以下路由配置:

const routes: Routes = [
  {
    component: MyComponent,
    path: '',
    children: [
      {
        component: MyListComponent,
        path: ''
      },
      {
        component: MyFormComponent,
        path: ':id/edit'
      },
      { path: '**', redirectTo: '' }
    ]
  }
];
Run Code Online (Sandbox Code Playgroud)

为了将参数限制为数字,我开始搜索并花费太多时间后,我已经找到了一种方法在这个封闭的(我不知道为什么)问题:https://github.com/angular/angular /问题/ 12442

所以,我将配置(特别是重要的部分)更改为以下内容:

{
  component: MyFormComponent,
  matcher: ComplexUrlMatcher('id', /[1-9]+\/edit/)
}

export function ComplexUrlMatcher(paramName: string, regex: RegExp) {
    return (
        segments: UrlSegment[],
        segmentGroup: UrlSegmentGroup,
        route: Route) => {

        const parts = [regex];
        const posParams: { [key: string]: UrlSegment } = {};
        const consumed: …
Run Code Online (Sandbox Code Playgroud)

angular2-routing angular

13
推荐指数
1
解决办法
1099
查看次数

你可以使用@ViewChild()或类似的路由器插座吗?如果是这样的话?

我反复遇到一种情况,我想访问路由器插座另一侧存在的子组件而不是选择器:

Like:
<router-outlet></router-outlet>

NOT:
<selector-name></selector-name>
Run Code Online (Sandbox Code Playgroud)

这与我所知道的ViewChild功能相冲突,但似乎我的组件应该能够看到路由器内部的内容并与之交互,就像选择器标签内的内容一样容易.

比如我试过这个:

export class RequestItemCatsComp {
    @ViewChild('child') child: RequestItemsComp;
    ***etc...***
ngAfterViewInit() {
    if (this.child) // Always child is undefined
        this.groupId = this.child.groupId;
    }
}
Run Code Online (Sandbox Code Playgroud)

但很自然,孩子是不确定的,因为这是错误的方式.有正确的方法吗?

我正在尝试使用服务来共享数据,但后来遇到另一个问题"表达在检查后已经改变",我希望能够在没有黑客攻击或启用prod模式的情况下解决这个问题.

angular2-routing angular2-services angular

12
推荐指数
1
解决办法
7060
查看次数