Question

我试图在我的angular（2.4.0）应用程序中实现ng-bootsraps，但我未能解决此问题

core.umd.js:3064 EXCEPTION: Uncaught (in promise): Error: DI Error

错误：DI错误

我正在使用sustemjs.config.js：

paths: {
        // paths serve as alias
        'npm:': 'node_modules/'
    },    
map: {
        app: 'app',
        '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
        '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
        '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
        '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
        '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
        '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
        '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
        '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
        '@ng-bootstrap/ng-bootstrap': 'npm:@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.js',

        'rxjs': 'npm:rxjs'
    },

我的组件是这个，对于complition

import { Component, OnInit, ViewContainerRef } from '@angular/core';
import { Router } from '@angular/router';
import { Hrtype } from './shared/hrtype.model';
import { HrtypeService } from './shared/hrtype.service';
import { HrtypeCreateComponent } from './create/hrtype-create.component';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ModalDismissReasons } from '@ng-bootstrap/ng-bootstrap';
@Component({
  selector: 'hrtype',
  templateUrl: '/Hrtype/Hrtype'
})
export class HrtypeComponent implements OnInit {
listHrType: Hrtype[];
gridOptions: any;
dataSource: any;
constructor(
    private hrtypeService: HrtypeService,
    private modalService: NgbModal,
    private ViewContainerRef: ViewContainerRef
) { }

create() {
    debugger;
    this.modalService.open(HrtypeCreateComponent).result.then((result) => {
        console.log("The Modal Closed;");
    });
}

我尝试删除systemJS.config.js中的引用，而不是DI错误，我找不到一个简单的404文件。

根据https://ng-bootstrap.github.io/#/getting-started提供的文件，这个方法应该是正确的，但是我没有看到我做错了什么，关于如何进一步调试这个的任何提示？

更新：发布错误的完整堆栈

ErrorHandler.handleError @ core.umd.js:3069
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
e.handleError @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
n.runGuarded @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
i @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
i @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
invoke @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
core.umd.js:3070 Error: Uncaught (in promise): Error: DI Error
Error: DI Error
    at NoProviderError.k (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at NoProviderError.BaseError [as constructor] (core.umd.js:1239)
    at NoProviderError.AbstractProviderError [as constructor] (core.umd.js:1365)
    at new NoProviderError (core.umd.js:1405)
    at ReflectiveInjector_._throwOrNull (core.umd.js:2937)
    at ReflectiveInjector_._getByKeyDefault (core.umd.js:2976)
    at ReflectiveInjector_._getByKey (core.umd.js:2908)
    at ReflectiveInjector_.get (core.umd.js:2777)
    at AppModuleInjector.NgModuleInjector.get (core.umd.js:8491)
    at CompiledTemplate.proxyViewClass.AppView.injectorGet (core.umd.js:11935)
    at CompiledTemplate.proxyViewClass.DebugAppView.injectorGet (core.umd.js:12315)
    at ElementInjector.get (core.umd.js:11790)
    at ReflectiveInjector_._getByKeyDefault (core.umd.js:2973)
    at ReflectiveInjector_._getByKey (core.umd.js:2908)
    at ReflectiveInjector_.get (core.umd.js:2777)
    at k (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at f (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at f (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
    at e.invokeTask (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at Object.onInvokeTask (core.umd.js:3971)
    at e.invokeTask (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at n.runTask (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at i (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
    at XMLHttpRequest.invoke (ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11)
ErrorHandler.handleError @ core.umd.js:3070
next @ core.umd.js:8041
schedulerFn @ core.umd.js:3689
SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238
SafeSubscriber.next @ Subscriber.ts:190
Subscriber._next @ Subscriber.ts:135
Subscriber.next @ Subscriber.ts:95
Subject.next @ Subject.ts:61
EventEmitter.emit @ core.umd.js:3675
NgZone.triggerError @ core.umd.js:4040
onHandleError @ core.umd.js:4001
e.handleError @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
n.runGuarded @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
i @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
i @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11
invoke @ ng2?v=xgyf_NNjNOwjpc-V0nf4kapkhXAW1d7YKBBhtPAR5Z41:11

Answer 1

似乎错误是我未能在应用程序模块中包含引用

DI与ng-bootstraps错误

1 个答案: