問題タブ [angular2-di]

Angular 2.0 ソース コード ( @angular/core": "2.0.0-rc.4) を検索すると、最初に 2 つのprovider.d.ts定義が含まれていることがわかりました。これは 1 つの側面ですが、他の側面は、このprovider.d.tsファイルのすべてのクラスと多くのプロパティが@deprecated.

Angular コンポーネントの外で Angular 2.0 DI を使用する方法を探していました。Angular 2.0 は非常に高度な状態 (リリース候補) にあるため、ほとんどの API はすでに安定しており、マイナーな変更が行われる可能性があります。それでも、DI に関連するこのクラスはすべて非推奨としてマークされています。同時に、インターネットのすべてのチュートリアルと例は、この provider.d.ts ファイルのクラスを使用しており、私の質問は. この@deprecatedフラグの意味と、この provider.d.ts ファイルで API を使用する必要がありますか?

環境：

REST Api の POST リクエストを形成するクラスがあります。それを requesterと呼びましょう。私のアプリで行われたすべての ajax 呼び出しは、これを介して送信されます。したがって、HTTPを介して提供したくないため、グローバルになり、リクエbootstrap(foo, [HTTP_PROVIDERS]);スターに注入する必要があります

コード：

エラー：

元の例外: HTTP のプロバイダーはありません! (リクエスタ -> Http)

（Angular 2 RC5を使用していることに注意してください）

簡単にするために、次のようなアプリがあります。

app.module.ts

root.service.ts

依存関係の例は次のとおりです。

依存関係 1.ts

私の質問は次のとおりです。なぜ、上記で、次のようなエラーが表示されるのですか No provider for PouchSync!?

次のように、 app.module.tsprovidersの配列にDependency1 と Dependency2 を追加することで問題を解決できます。

app.module.ts (固定)

これは非常に醜いようです。これらの依存関係についてのみRootService知る必要があります。ここで何か間違ったことをしていますか？または、なぜこのようにしなければならないのか、誰かが説明できますか? 確かに、注入するときRootService、インジェクターはそれが依存していることを確認できるDependency1ためDependency2、それらも注入する必要があるため、アプリケーション全体のシングルトンにもなります。

Angular 1 では、サービスのファクトリを頻繁に使用して、多くのコンポーネントからアクセス可能な共有状態を保存していました。Angular 2 では @Injectable() として注入されるすべてのサービスが毎回作成されるため、共有状態が失われるようです。

ルート モジュールのprovidersメタ キーでサービスを「登録」しますが、それでも一時的なインスタンスを取得します。

私が持っているもの：

コンポーネントでそれを呼び出すには：

そしてモジュールの定義:

ArtistService静的インスタンスとしてロードされたままになるように「登録」する他の方法があると思いますか? それは DI 経由で可能ですか、それとも静的インスタンス メソッドを手動で作成する必要がありますか?

更新:
上記のコードが機能することがわかりました。データが正しくキャッシュされない原因となった論理エラーとともに、間違った場所を探していました。

上記のコードは機能し、最上位の AppModuleprovidersのセクションでサービスを割り当てることが、AppComponent の間、親参照をロードしたままにするための鍵となります。これは、 Singletonインスタンスを提供するアプリの存続期間中、効果的にロードされたままになります。

一時的なインスタンスを取得するには、コンポーネントがロード/再ロードされるたびにサービスを作成する実際のコンポーネントprovidersでメタ タグとサービス名を宣言できます。

Angular 2 で一般化されたデータ サービスを作成しようとしていますが、奇妙なエラーが発生します。基本的に、複数のケースで使用できるように、メソッドが API URL の一部を受け取る HTTP サービスを作成しています。たとえば、'projects/' を渡し、'api/' と結合して 'api/projects/' を取得し、それを http 呼び出しで使用したいと考えています。

私の現在のdataService.ts：

'projects' をパラメータとして GetAll を呼び出そうとしているコンポーネント:

app.module.ts にプロバイダーとしてサービスを追加しました。もう 1 つ注目すべき点は、ここで示したコンポーネントは、AppComponent 内にある HomeComponent というコンポーネントの子コンポーネントであることです。

HomeComponent は次のようになります。

エラー：

GetCall に渡す文字列について不平を言っていることは知っていますが、その理由はわかりません。

どんな助けでも大歓迎です！

TemplateRef<any>とに依存するディレクティブを書いていViewContainerRefます。しかし、私のディレクティブはこれらの依存関係を注入できません。以下はすべて私のコードです:

main.ts

app.module.ts

app.component.ts

HelloWorld.directive.ts

そして、これが私のトランスパイルされた HelloWorld.directive.js です:

次に、アプリを実行すると、次のエラーが表示されます。

エラー: (SystemJS) HelloWorld のすべてのパラメーターを解決できません: (?, ?)。

エラー: HelloWorld のすべてのパラメーターを解決できません: (?, ?)。CompileMetadataResolver.getDependenciesMetadata ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14268:21 ) で CompileMetadataResolver.getTypeMetadata ( http://localhost:5000/node_modules/@angular/ CompileMetadataResolver.getDirectiveMetadata ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:13944:30 )で eval ( http ://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14037:51 ) Array.forEach (ネイティブ) で CompileMetadataResolver.getNgModuleMetadata (http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14031:51 ) RuntimeCompiler._compileComponents ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler ) .umd.js:16721:49 ) で RuntimeCompiler._compileModuleAndComponents ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:16659:39 ) で RuntimeCompiler.compileModuleAsync ( http:// localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:16650:23 ) PlatformRef_._bootstrapModuleWithZone ( http://localhost:5000/node_modules/@angular/core/bundles/core.umd.js ) :6707:29 ) http://localhost:5000/ViewContainerRefApp/main.js の評価 CompileMetadataResolver.getDependenciesMetadata ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14268:21 ) で CompileMetadataResolver でhttp://localhost:5000/ViewContainerRefApp/main.jsをロード中に エラーが発生しました。 getTypeMetadata ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14169:28 ) CompileMetadataResolver.getDirectiveMetadata ( http://localhost:5000/node_modules/@angular/compiler/bundles ) /compiler.umd.js:13944:30 ) で eval ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14037:51 ) で Array.forEach (ネイティブ) で CompileMetadataResolver で.getNgModuleMetadata (http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:14031:51 ) RuntimeCompiler._compileComponents ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler ) .umd.js:16721:49 ) で RuntimeCompiler._compileModuleAndComponents ( http://localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:16659:39 ) で RuntimeCompiler.compileModuleAsync ( http:// localhost:5000/node_modules/@angular/compiler/bundles/compiler.umd.js:16650:23 ) PlatformRef_._bootstrapModuleWithZone ( http://localhost:5000/node_modules/@angular/core/bundles/core.umd.js ) :6707:29 ) http://localhost:5000/ViewContainerRefApp/main.js の評価http://localhost:5000/ViewContainerRefApp/main.js の ロード中にエラーが発生しました

このライブ サンプルからコードをコピーしたところ、同じエラーが発生しました。

とは登録されていないTemplateRef<any>ようViewContainerRefです。metadataしかし、私はその理由を見つけることができません。誰でも私を助けることができますか？ありがとうございました。

ASP.NET Core の TypeScript で Angular 2.0.0 を使用しています。私の目標は、サーバー側の変数に基づいて、アプリで AppConfig サービスを作成することです。他のいくつかの回答の助けを借りて、次のコードを作成できました。

インデックス.cshtml

app.config.ts

main.ts

app.module.ts

dashboard.service.ts

Chrome コンソールからの出力

ご覧のとおり、何らかの理由で作成されたものと注入されAppConfigたものは同じではなく、 にapiUrl値が表示されませんDashboardService。エラーはここのどこかにあると思います：

しかし、私はAngular2にまったく慣れていないため、修正方法がわかりません。どこに問題があるのか​​教えていただけますか？