对于Angular2中具有身份验证的网站,我想使用主应用程序组件中身份验证子模块的一个组件.然而,我不断得到以下错误:

app/app.component.ts(3,10): error TS2305: Module '"<dir>/app/auth/auth.module"' has no exported member 'SigninComponent'.

即使出口了重要的零部件.

项目文件夹 struct 如下所示:

enter image description here

app/auth/auth.module.ts:

import { NgModule }       from '@angular/core';
import { CommonModule }   from '@angular/common';
import { FormsModule }    from '@angular/forms';

import { RegisterComponent }    from './components/register.component';
import { SigninComponent }    from './components/signin.component';
import { HomeComponent }    from './components/home.component';

import { AuthService } from './services/auth.service';
import { AuthHttp } from './services/auth-http';

@NgModule({
  imports: [
      CommonModule,
      FormsModule
  ],
  declarations: [
      RegisterComponent,
      SigninComponent,
      HomeComponent
  ],
  providers: [
      AuthService,
      AuthHttp
  ],
  exports: [
      RegisterComponent,
      SigninComponent,
      HomeComponent
  ]
})
export class AuthModule {}

app/auth/components/signin.component.ts:

import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { AuthService } from '../services/auth.service';

@Component({
    selector: 'signin',
    templateUrl: 'app/auth/signin.html'
})
export class SigninComponent {
    ...
}

app/app.component.ts:

import { Component, OnInit } from '@angular/core';
import { Router, RouterOutlet } from '@angular/router';
import { SigninComponent, RegisterComponent } from './auth/auth.module';
import { AuthHttp } from './auth/services/auth-http';
import { AuthService } from './auth/services/auth.service';

@Component({
    selector: 'myapp',
    templateUrl: 'app/app.html'
})

export class AppComponent implements OnInit {
    ...
}

app/app.module.ts:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { HttpModule }    from '@angular/http';
import { RouterModule } from '@angular/router';
import { AppRoutingModule } from './app-routing.module';
import { AuthModule } from './auth/auth.module';

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

import { AuthService } from './auth/services/auth.service';
import { AuthHttp } from './auth/services/auth-http';

@NgModule({
  declarations: [
      AppComponent,
      AuthService,
      AuthHttp
  ],
  bootstrap: [ AppComponent ],
  imports : [
      BrowserModule,
      FormsModule,
      HttpModule,
      AuthModule,
      AppRoutingModule
  ],
  providers: [
      AuthService,
      AuthHttp
  ]
})
export class AppModule {
}

推荐答案

你不需要排队:

import { SigninComponent, RegisterComponent } from './auth/auth.module';

在你的app.component.ts中,因为你已经在你的app.module.ts中包含了AuthModule.AutModule导入足以在应用程序中使用您的组件.

您得到的错误是一个TypeScript错误,而不是Angular错误,它正确地指出没有导出成员,因为它为导出而不是Angular模块导出搜索有效的EC6语法.因此,这条线适用于您的app.component.ts:

import { SigninComponent } from './auth/components/signin.component';

Typescript相关问答推荐

Angular 垫页分类和垫排序不起作用

输入具有相同键但值类型不同的对象

将对象属性路径描述为字符串数组的类型

为什么在将条件返回类型的字符串赋给数字时没有类型错误?

Tailwind CSS样式不在Svelte应用程序中呈现

ReturnType此索引方法与点表示法之间的差异

如何从TypScript中的接口中正确获取特定键类型的所有属性?

使用带有RxJS主题的服务在Angular中的组件之间传递数据

错误TS2403:后续变量声明必须具有相同的类型.变量';CRYPTO';的类型必须是';CRYPATO';,但这里的类型是';CRYPATO';

如何实现异构数组内函数的类型缩小

如何获取受类型脚本泛型约束的有效输入参数

如何按属性或数字数组汇总对象数组

如何在本地存储中声明该类型?

如何键入对象转换器

推断集合访问器类型

使用泛型以自引用方式静态键入记录的键

如何填写Partial的一些属性并让类型系统知道它?

仅当定义了值时才按值筛选数组

换行TypeScript';s具有泛型类型的推断数据类型

数据库中的表请求返回如下日期:2023-07-20T21:39:00.000Z 我需要将此数据格式化为 dd/MM/yyyy HH:mm