加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angular – 错误:找不到加载’ProfileDetailsComponent’的主要

发布时间:2020-12-17 07:18:06 所属栏目:安全 来源:网络整理
导读:我正在尝试在我的应用程序中使用路由,使用路由器版本3.0.0-beta.1,应用程序正在运行,但是当我点击subjects.component.html中的“下一步”按钮时,我期待获得’的内容’ profileDetails.component.html”.我创造了一个plunkr例如.这里: http://plnkr.co/edit/
我正在尝试在我的应用程序中使用路由,使用路由器版本3.0.0-beta.1,应用程序正在运行,但是当我点击subjects.component.html中的“下一步”按钮时,我期待获得’的内容’ profileDetails.component.html”.我创造了一个plunkr例如.这里: http://plnkr.co/edit/jR3jnC6CzmRVCoVFrn1W?p=preview虽然由于我正在使用的角度2材料按钮等,但它不适用于plunkr,但有人能告诉我哪里出错了吗?
这是我的主要内容:
import {bootstrap} from '@angular/platform-browser-dynamic';
import {enableProdMode} from '@angular/core';
import {AppComponent} from './app/app.component';
import {HTTP_PROVIDERS} from '@angular/http';
import { appRouterProviders } from './app/app.routes';

//import {disableDeprecatedForms,provideForms} from '@angular/forms';

bootstrap(AppComponent,[
  // disableDeprecatedForms(),// provideForms(),HTTP_PROVIDERS,appRouterProviders
]);

这是app.routes.ts:

import { provideRouter,RouterConfig } from '@angular/router';
import {SubjectsComponent} from './subjects.component';
import {ProfileDetailsComponent} from './profileDetails.component';
import {AgreementComponent} from './agreement.component';

export const routes: RouterConfig = [
  { path: 'card',component: BasicCardComponent },{ path: 'subjects',component: SubjectsComponent },{ path: 'profile',component: ProfileDetailsComponent },{ path: 'agreement',component: AgreementComponent }
];

export const appRouterProviders = [
  provideRouter(routes)
];

这是我的app.component.ts:

@Component({
  selector: 'my-app',template: `
  <a [routerLink]="['/card']"></a>
  <router-outlet></router-outlet>
  `,// templateUrl: 'app/app.component.html',styleUrls: ['app/app.component.css'],directives: [BasicCardComponent,MdButton,MdCard,MdToolbar,MdIcon,MdInput,MD_INPUT_DIRECTIVES,MdCheckbox,ROUTER_DIRECTIVES],providers:[MdIconRegistry]
})

该流程有点像这个app.component.ts-> basicCard.component.ts-> basicCard.component.html-> subjects.component.ts-> subjects.component.html-> profileDetails.component. TS-> profileDetails.component.html

在您的app.component中,您缺少路由器插座指令.
@Component({
  selector: 'my-app',// you can do somthing like this
  template: `<card></card> 
            <router-outlet></router-outlet> `,styles: ....
  directives: [ROUTER_DIRECTIVES]
})
export class AppComponent {

}

plunker

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读