Импортируйте угловой модуль 2 в мой проект

Question

Я пытаюсь импортировать модуль angular2 в свой проект.

Этот модуль поможет мне получить данные с помощью json rpc из нашей ERP-системы Odoo.

Вот эта ссылка: https://www.npmjs.com/package/angular2-odoo-jsonrpc.

Вот что я сделал до сих пор: import {Component} from '@ angular/core'; импорт {OdooRPCService} из 'angular2-odoo-jsonrpc';

App.component.ts

@Component({ 
    selector: 'my-app', 
    template: `<h1>Hello {{name}}</h1>`, 
    providers: [OdooRPCService] 

}) 
export class AppComponent { name = 'Angular'; 
constructor(odooRPC: OdooRPCService){ 
    odooRPC.init({ 
    odoo_server: "http://localhost:8069", 
    http_auth: "duniakado@go2.web.id:password" 
    }); 
    odooRPC.login('duniakado', 'duniakado@go2.web.id', 'password').then(res => { 
    console.log('login success'); 
    }).catch(err => { 
    console.error('login failed', err); 
    }) 
} } 

Я также включаю модуль в указательном HTML

<script src="node_modules/angular2-odoo-jsonrpc/odoorpc.service.js"></script> 

Затем я включить модуль в моем systemjs.config.js

systemjs.config.js

/** 
* System configuration for Angular samples 
* Adjust as necessary for your application needs. 
*/ 
(function (global) { 
    System.config({ 
    paths: { 
     // paths serve as alias 
     'npm:': 'node_modules/' 
    }, 
    // map tells the System loader where to look for things 
    map: { 
     // our app is within the app folder 
     app: 'app', 

     // angular bundles 
     '@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', 

     // other libraries 
     'rxjs':      'npm:rxjs', 
     'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js', 
     'angular2-odoo-jsonrpc': 'npm:angular2-odoo-jsonrpc/odoorpc.service.js' 


    }, 
    // packages tells the System loader how to load when no filename and/or no extension 
    packages: { 
     app: { 
     main: './main.js', 
     defaultExtension: 'js' 
     }, 
     rxjs: { 
     defaultExtension: 'js' 
     } 
    } 
    }); 
})(this); 

Я получил много ошибок в моей консоли

core.umd.js:3491 EXCEPTION: No provider for Http!ErrorHandler.handleError @ core.umd.js:3491(anonymous function) @ core.umd.js:8362ZoneDelegate.invoke @ zone.js:229onInvoke @ core.umd.js:4405ZoneDelegate.invoke @ zone.js:228Zone.run @ zone.js:113(anonymous function) @ zone.js:509ZoneDelegate.invokeTask @ zone.js:262onInvokeTask @ core.umd.js:4396ZoneDelegate.invokeTask @ zone.js:261Zone.runTask @ zone.js:151drainMicroTaskQueue @ zone.js:405ZoneTask.invoke @ zone.js:336 
core.umd.js:3496 ORIGINAL STACKTRACE:ErrorHandler.handleError @ core.umd.js:3496(anonymous function) @ core.umd.js:8362ZoneDelegate.invoke @ zone.js:229onInvoke @ core.umd.js:4405ZoneDelegate.invoke @ zone.js:228Zone.run @ zone.js:113(anonymous function) @ zone.js:509ZoneDelegate.invokeTask @ zone.js:262onInvokeTask @ core.umd.js:4396ZoneDelegate.invokeTask @ zone.js:261Zone.runTask @ zone.js:151drainMicroTaskQueue @ zone.js:405ZoneTask.invoke @ zone.js:336 
core.umd.js:3497 Error: DI Error 
    at NoProviderError.BaseError [as constructor] (core.umd.js:1225) [angular] 
    at NoProviderError.AbstractProviderError [as constructor] (core.umd.js:1400) [angular] 
    at new NoProviderError (core.umd.js:1439) [angular] 
    at ReflectiveInjector_._throwOrNull (core.umd.js:3370) [angular] 
    at ReflectiveInjector_._getByKeyDefault (core.umd.js:3407) [angular] 
    at ReflectiveInjector_._getByKey (core.umd.js:3357) [angular] 
    at ReflectiveInjector_.get (core.umd.js:3119) [angular] 
    at AppModuleInjector.NgModuleInjector.get (core.umd.js:8914) [angular] 
    at CompiledTemplate.proxyViewClass.AppView.injectorGet (core.umd.js:12314) [angular] 
    at CompiledTemplate.proxyViewClass.DebugAppView.injectorGet (core.umd.js:12694) [angular] 
    at CompiledTemplate.proxyViewClass.View_AppComponent_Host0.createInternal (host.ngfactory.js:19) [angular] 
    at CompiledTemplate.proxyViewClass.AppView.createHostView (core.umd.js:12270) [angular] 
    at CompiledTemplate.proxyViewClass.DebugAppView.createHostView (core.umd.js:12678) [angular] 
    at ComponentFactory.create (core.umd.js:7705) [angular]ErrorHandler.handleError @ core.umd.js:3497(anonymous function) @ core.umd.js:8362ZoneDelegate.invoke @ zone.js:229onInvoke @ core.umd.js:4405ZoneDelegate.invoke @ zone.js:228Zone.run @ zone.js:113(anonymous function) @ zone.js:509ZoneDelegate.invokeTask @ zone.js:262onInvokeTask @ core.umd.js:4396ZoneDelegate.invokeTask @ zone.js:261Zone.runTask @ zone.js:151drainMicroTaskQueue @ zone.js:405ZoneTask.invoke @ zone.js:336 
zone.js:392 Unhandled Promise rejection: No provider for Http! ; Zone: <root> ; Task: Promise.then ; Value: NoProviderError {_nativeError: Error: No provider for Http! 
    at NoProviderError.BaseError [as constructor] (http://localhost:300…, keys: Array[1], injectors: Array[1]} Error: DI Error 
    at NoProviderError.BaseError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1225:31) [angular] 
    at NoProviderError.AbstractProviderError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1400:20) [angular] 
    at new NoProviderError (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1439:20) [angular] 
    at ReflectiveInjector_._throwOrNull (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:3370:23) [angular] 
    at ReflectiveInjector_._getByKeyDefault (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:3407:29) [angular] 
    at ReflectiveInjector_._getByKey (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:3357:29) [angular] 
    at ReflectiveInjector_.get (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:3119:25) [angular] 
    at AppModuleInjector.NgModuleInjector.get (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:8914:56) [angular] 
    at CompiledTemplate.proxyViewClass.AppView.injectorGet (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12314:49) [angular] 
    at CompiledTemplate.proxyViewClass.DebugAppView.injectorGet (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12694:53) [angular] 
    at CompiledTemplate.proxyViewClass.View_AppComponent_Host0.createInternal (/AppModule/AppComponent/host.ngfactory.js:19:59) [angular] 
    at CompiledTemplate.proxyViewClass.AppView.createHostView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12270:25) [angular] 
    at CompiledTemplate.proxyViewClass.DebugAppView.createHostView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12678:56) [angular] 
    at ComponentFactory.create (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:7705:29) [angular]consoleError @ zone.js:392_loop_1 @ zone.js:421drainMicroTaskQueue @ zone.js:425ZoneTask.invoke @ zone.js:336 
zone.js:394 Error: Uncaught (in promise): Error: No provider for Http!(…) 

Я хотел бы отметить тот факт, что мой проект Hello угловатые работает отлично, то все становится перепутались с этим модулем.

Заранее спасибо.

Answer 1

Похоже, что вы забыли импортировать HttpModule в вашем @NgModule

@NgModule({ 
    imports: [ ... HttpModule, ...] 
    ... 
}) 
export class SomeModule {