問題タブ [angular2-services]

私はクラスを持っていますLayer:

私のコンポーネントで拡張しますLines：

ご覧のとおり、Gameから継承するすべてのコンポーネントにサービスを注入する必要がありLayerます。ただし、クラスにサービスを注入したいLayerので、それを使用してサービスに依存するメソッドを作成できます。また、毎回自分でコンポーネントにサービスを注入する必要はありません。

言うまでもなく、Layerコンポーネントにサービスを注入しても機能しません。

angular 2.0.0-beta.0 を使用しています

これにより、Hello World が正常に表示されるため、app.component.ts が正しくブートストラップされます。DataService からデータが返されないか、表示できません。コンパイル エラーはありません。JavaScript の alert() のような TypeScript のポップアップ ウィンドウで、データが DataService によって返されているかどうかをすばやく確認できますか?

app.component.ts

data.service.ts

DI は、アプリケーションで同じサービスを使用し、必要に応じて変更できるようにするために実装されていると思いました。ただし、このスニペット (Angular 2.0.0-beta.0) は機能しません。

明示的なサービス要件があれば、次のように機能します。

公式ドキュメントには多少の一貫性がありませんが、plunkr の例でも同じです。

これは意図した DI の使用方法ですか? サービスを必要とするすべてのクラスにサービスをインポートする必要があるのはなぜですか? また、起動時にサービスを一度だけ記述できない場合の利点はどこにありますか?

Angular 2 と Typescript を使用して概念実証アプリを作成しようとしています。toastr通知ライブラリを組み込みたいと考えており、定義ファイルなしで実行する簡単な方法があることを望んでいました。

共通サービス ディレクトリに toastr.d.ts というファイルを作成しました]:

サービス common.ts から呼び出されます

[DiffingTSCompiler]: Typescript が次のエラーを検出しました: app/services/common/common.ts (3,9): Module '"toastr"' has no export member 'toastr'.

すべてのコードはCloud 9にあります

Angular1 から Angular2 にいくつかのコードを移行していますが、いくつかの問題があります。json 応答を開き、テンプレートに入力し、テンプレート ng 関数からデータにアクセスできますが、コンポーネント クラスから直接データにアクセスすることはできませんでした。私が読んだこととAngular2 http / observableが純粋なjsonオブジェクトを返していないように見えるエラーメッセージから、再マップする必要があると思われますが、その方法はわかりません。onPromise を使用して promise に戻すことも可能であると思いますが、それを機能させることができませんでした。私は解決策を探すのに多くの時間を費やし、それらのほとんどを実装しようとしましたが、うまくいきませんでした。応答を使用可能な形式に再マッピングする方法や、応答内のデータに直接アクセスする方法について誰かがアドバイスできる場合は、大歓迎です。

サービスからの http 呼び出しの例:-

サブスクライブの例:-

コンソール ログ エラーの例:-

データ構造の例 (テスト用に非常に単純化) :-

Angular1 では、関数からデータに直接アクセスできました。たとえば、次のように、Angular2 でも同様のことをしたいと考えています。

'my-app-name/services'次のインポートのような行を回避するようなものを導入するにはどうすればよいですか?

私は AngularJS 2 サービスを作成し、それを 2 つの異なるコンポーネント (App-Component と Sub-Component) で使用しています。私のサービスの各出力プロパティ「ログ」（文字列）。

StateService クラス:

成分 ：

コードの実例はこちら

サービスが一度作成されることを除いて、各コンポーネントが WriteToLog メソッドを呼び出すと、出力は各コンポーネントで同じになりますが、そうではありません。

出力例：

App-Component はこれを出力できます:

インスタンス 1 - 2016 年 1 月 21 日木曜日 11:43:51 に作成

App-Component から - これは 2016 年 1 月 21 日木曜日 11:43:54 です

App-Component から - これは 2016 年 1 月 21 日木曜日 11:43:55 です

サブコンポーネントはこれを出力できます：

インスタンス 2 - 2016 年 1 月 21 日木曜日 11:43:51 に作成

サブコンポーネントから - これは 2016 年 1 月 21 日木曜日 11:43:57 です

サブコンポーネントから - これは 2016 年 1 月 21 日木曜日 11:43:58 です

そのため、サービスの 2 つのインスタンスが作成されたように見えます (インスタンス 1 + インスタンス 2)。

必要なインスタンスは 1 つだけです ;) ログに文字列を追加する場合、これは両方のコンポーネントに表示される必要があります。

ご協力ありがとうございました