声明合并无法在Angular 2项目中工作

时间:2017-03-09 22:32:42

标签: angular typescript webpack-2

我正在尝试按照this answer中的描述实现自定义RxJS运算符。以下是我的申请中的相关摘要:

rxjs-extensions.ts

import { Observable } from 'rxjs/Observable';

function restrictToCommand<T>(this: Observable<T>): Observable<T> {
    console.log('works');
    return Observable.empty()
}

declare module 'rxjs/Observable' {
    interface Observable<T> {
        restrictToCommand: typeof restrictToCommand;
    }
}

Observable.prototype.restrictToCommand = restrictToCommand;

consumer.ts

import { Observable } from 'rxjs/Observable';
import '../../rxjs-extensions';
...
export class MyComponent {    

...

    private load(): void {
        Observable.of(1).restrictToCommand();
    }

...

}

调用load()时,我收到以下异常:

EXCEPTION: Uncaught (in promise): Error: Error in ./MyParentComponent class MyParentComponent - inline template:2:4 caused by: __WEBPACK_IMPORTED_MODULE_2_rxjs_Observable__.Observable.of(...).restrictToCommand is not a function
TypeError: __WEBPACK_IMPORTED_MODULE_2_rxjs_Observable__.Observable.of(...).restrictToCommand is not a function
    at MyComponent .load (eval at <anonymous> (http://localhost:8080/app.js:3530:1), <anonymous>:45:75)
    at MyComponent .ngOnInit (eval at <anonymous> (http://localhost:8080/app.js:3530:1), <anonymous>:63:14)
    at Wrapper_MyComponent .ngDoCheck (/AppModule/JobsPanelComponent/wrapper.ngfactory.js:22:53)
    at CompiledTemplate.proxyViewClass.View_MyParentComponent 0.detectChangesInternal (/AppModule/MyParentComponent/component.ngfactory.js:62:32)
    at CompiledTemplate.proxyViewClass.AppView.detectChanges (eval at <anonymous> (http://localhost:8080/app.js:3185:1), <anonymous>:301:14)
    at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (eval at <anonymous> (http://localhost:8080/app.js:3185:1), <anonymous>:394:44)
    at CompiledTemplate.proxyViewClass.View_MyParentComponentt_Host0.detectChangesInternal (/AppModule/MyParentComponent/host.ngfactory.js:29:19)
    at CompiledTemplate.proxyViewClass.AppView.detectChanges (eval at <anonymous> (http://localhost:8080/app.js:3185:1), <anonymous>:301:14)
    at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (eval at <anonymous> (http://localhost:8080/app.js:3185:1), <anonymous>:394:44)
    at ViewRef_.detectChanges (eval at <anonymous> (http://localhost:8080/app.js:1708:1), <anonymous>:136:20)

我正在使用Angular 2,Webpack 2和TypeScript 2.0.3。

2 个答案:

答案 0 :(得分:1)

要解决此问题,我必须将import './rxjs-extensions'添加到我的app.module.ts,我已导入./rxjs-imports,这是一个包含我正在使用的所有RXJS运算符的文件我的申请。

不幸的是,我仍然不完全了解正在发生的事情。如果我获得更清楚的理解,我会更新答案。

答案 1 :(得分:0)

您是否添加了Observable.of运算符?

在你的rxjs-extensions模块中,

import 'rxjs/add/observable/of';