【发布时间】：2016-10-25 22:03:46
【问题描述】：
我正在使用 ASP.NET Core 中的 @angular 开发 Angular 2 应用程序。我有一个位于基本 url 的登录页面，它有自己的布局文件、索引页面和控制器。
我想添加的是我网站 /toolkit 的整个部分。首先，我使用我的内部布局、索引和控制器创建了一个MyProfileComponent 以在 /toolkit 中休息。我还创建了一个 ProfileComponent 驻留在 /toolkit/profile/:uniquename
问题是，当我在添加内部路由后运行应用程序时，出现错误。
/toolkit 抛出此错误
异常：调用节点模块失败并出现错误：错误：未捕获（承诺中）：错误：找不到加载“ProfileComponent”的主要出口
错误：找不到加载“ProfileComponent”的主要出口
在 getOutlet (D:\Projects..\node_modules\@angular\router\bundles\router.umd.js:3018:23)
和 /toolkit/profile/sdfsad 抛出这个错误
异常：调用节点模块失败并出现错误：错误：未捕获（承诺中）：[object Object]
我是 angular 2 的新手，我所看到的一切都希望您在组件上使用现在已过时的 Directives 属性，但是在这个版本的 angular 2 中已经消失了（@angular 是 2.0.0 版）。我可能做错了什么，但这里是碎片：
_InternalLayout（去掉多余的东西）
<head>
<base href="/toolkit" />
</head>
<body class="menubar-top menubar-dark theme-primary">
@RenderBody()
@RenderSection("scripts", required: false)
</body>
/Toolkit/Index.cshtml
@{
Layout = "~/Views/Shared/_InternalLayout.cshtml";
}
<app asp-prerender-module="@Url.Content("ClientApp/dist/main-server")">Loading...</app>
<script src="@Url.Content("~/dist/vendor.js")" asp-append-version="true"></script>
@section scripts {
<script src="@Url.Content("~/dist/main-client.js")" asp-append-version="true"></script>
}
app.component.html
<router-outlet></router-outlet>
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app',
template: require('./app.component.html'),
})
export class AppComponent {
}
app.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { UniversalModule } from 'angular2-universal';
import { AppComponent } from './components/app/app.component'
import { LandingPageLayoutComponent } from './components/landing/landing-page-layout.component';
import { SignInComponent } from './components/account/sign-in.component';
import { RegisterComponent } from './components/account/register.component';
import { ProfileComponent } from './components/profile/profile.component';
import { MyProfileComponent } from './components/profile/my-profile.component';
@NgModule({
bootstrap: [ AppComponent ],
declarations: [
AppComponent,
LandingPageLayoutComponent,
SignInComponent,
RegisterComponent,
ProfileComponent,
MyProfileComponent
],
imports: [
UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.
RouterModule.forRoot([
{ path: 'signin', component: SignInComponent },
{ path: 'register', component: RegisterComponent },
{
path: 'toolkit',
component: MyProfileComponent,
children: [
{ path: '' },
{ path: 'profile/:uniquename', component: ProfileComponent },
]
},
{ path: '', component: LandingPageLayoutComponent },
{ path: '**', redirectTo: 'error' }
])
]
})
export class AppModule {
}
根页面、登录和注册所有工作，尽管当我尝试在 /account 下登录和注册孩子时遇到了同样的问题。我确定我在做一些愚蠢的事情，一旦我们弄清楚了，我会尝试在这些页面上进行其他嵌套。
编辑
如果重要的话，我正在使用this Visual Studio 2015 template。在我开始尝试添加嵌套路由之前，它工作正常。
【问题讨论】：
标签： angular asp.net-core angular2-routing