在 Angular 2 ( Ionic 2/Angular 2/Typescript ) 中的服务中注入服务时如何传递依赖项参数 [英] How to pass parameters for dependency while Injecting services in services in Angular 2 ( Ionic 2 / Angular 2 / Typescript )
问题描述
我正在制作一个示例应用程序,以在打字稿中连接到 ionic 2 中的 websocket 服务器.链接到 repo
I'm making a sample application to make connection to a websocket server in ionic 2 in typescript. link to repo
我的要求是在应用程序启动时建立 websocket 连接
My requirement is to make the websocket connection during application start up
我正在使用 angular2-websocket 创建连接.
I'm using angular2-websocket to creating the connection.
参考资料:
http://blog.thoughtram.io/angular/2015/05/18/dependency-injection-in-angular-2.html
我收到一个错误无法解析 '$WebSocket'(String, Array, ?) 的所有参数.确保所有参数都用 Inject 修饰或具有有效的类型注释,并且 '$WebSocket' 被修饰可注射."
I'm getting a error " Cannot resolve all parameters for '$WebSocket'(String, Array, ?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that '$WebSocket' is decorated with Injectable. "
代码:app.ts
import {App, Platform} from 'ionic-framework/ionic';
import {TabsPage} from './pages/tabs/tabs';
import {ConnectionService} from './framework/connection/connection-service'
import {$WebSocket} from 'angular2-websocket/angular2-websocket';
import {bootstrap} from 'angular2/platform/browser';
// https://angular.io/docs/ts/latest/api/core/Type-interface.html
import {Type} from 'angular2/core';
@App({
template: '<ion-nav [root]="rootPage"></ion-nav>',
config: {}
})
export class MyApp {
rootPage: Type = TabsPage;
constructor(platform: Platform, private conn : ConnectionService) {
platform.ready().then(() => {
this.conn.connect();
});
}
}
bootstrap(MyApp, [$WebSocket, ConnectionService]);
import {Injectable, Component, Inject} from 'angular2/core';
import {$WebSocket} from 'angular2-websocket/angular2-websocket';
import {bootstrap} from 'angular2/platform/browser';
@Injectable()
export class ConnectionService {
private _status: number;
//private connection: $WebSocket;
constructor( private connection : $WebSocket = new $WebSocket("ws://echo.websocket.org") ) {
console.log("Starting connection");
//this.connection = new $WebSocket("ws://echo.websocket.org");
this.connection.onClose(this.onCloseHandler);
this.connection.onError(this.onErrorHandler);
this.connection.onOpen(this.onOpenHandler);
this.connection.onMessage(this.onRecieveHandler, {});
}
...
public connect() {
this.connection.connect(true);
}
...
}
bootstrap(ConnectionService, [$WebSocket]);
推荐答案
我的问题的解决方案是使用@App() 注释的(特定于离子)提供程序字段而不是使用引导程序
The Solution to my problem was using @App() Annotation's (Specific to ionic) provider field instead of using bootstrap
bootstrap(ConnectionService,
[provide($WebSocket, useValue: new WebSocket("ws://echo.websocket.org")]);
例如.
@App({
template: '<ion-nav [root]="rootPage"></ion-nav>',
config: {},
providers : [ provide( $WebSocket, { useValue: new $WebSocket("ws://echo.websocket.org") }), ConnectionService]
})
可以在此处
这篇关于在 Angular 2 ( Ionic 2/Angular 2/Typescript ) 中的服务中注入服务时如何传递依赖项参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!