我是 Angular 2 的初学者,我正在尝试了解如何从功能模块导出类,并将其导入到我的主模块中。
当我尝试在 typescript 中编译它时,我收到以下两个错误:
app/app.component.ts(11,21):错误 TS2304:找不到名称 “添加服务”。
app/app.module.ts(4,9):错误 TS2305:模块 '“C:/angular/app/add/arithmetic.module”'没有导出成员 “添加服务”。
我的树很简单:
/
index.html
package.json
systemjs.config.js
tsconfig.json
typings.json
app/
app.component.html
app.component.ts
app.module.ts
main.ts
add/
add.service.ts
arithmetic.module.ts
有趣的部分如下:
app.module.ts:
import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {AppComponent} from './app.component';
// this next line generates an error from typescript compiler:
// app/app.module.ts(4,9): error TS2305: Module
// '"C:/angular/app/add/arithmetic.module"' has no exported
// member 'AddService'.
import {AddService} from './add/arithmetic.module';
@NgModule({
imports: [BrowserModule],
declarations: [AppComponent, AddService],
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 {
calculate() {
// this next line generates the error:
// app/app.component.ts(11,21):
// error TS2304: Cannot find name 'AddService'.
var c = new AddService();
var x = c.addTwoNumbers(3, 5);
console.log(x);
}
}
算术.module.ts
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {AddService} from './add.service';
@NgModule({
imports: [CommonModule],
exports: [AddService]
})
export default class ArithemeticModule { }
添加服务.ts
export class AddService {
addTwoNumbers(a: number, b: number) : number {
return a + b;
}
}
这确实令人沮丧,因为
1) 我正在导出 AddService——它被标记为“导出”,并且在 ArithmeticModule 中我使用 @NgModule 元数据将其标记为导出。
2) 我正在从主模块中导入[据称]导出的 AddService 类,因此 AddService 应该可用,因为它是从 ArithmeticModule 导出的
如果我直接从组件内导入 AddService ,效果很好,但这不是我想要的:我想从我的主模块导入该类,并利用该模块的导出,就像我们所做的那样对于 Angular 的模块(例如 BrowserModule 和 FormsModule)。 @NgModule 的文档说我们应该能够做到这一点 - 从我的功能模块导入一次到我的主模块中,然后它就可以在整个主模块中使用。
有人可以告诉我我做错了什么吗?或者我是否误解了模块的用途?
最佳答案
对于使用providers: [...]
的服务,它们将被添加到根注入(inject)器(来自非延迟加载的模块)。
exports: []
用于指令、组件和管道以及导出指令、组件和管道的模块。
关于angular - 从 Angular2 模块导出时遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39690059/