3

ASP.net MVC Web API からデータをフェッチする小さな Angular 2 アプリがあります。認証の使用。Angular 2 で Ahead Of Time コンパイラを使用しようとしています。次のコマンドを実行しています

node_modules \ .bin\ngc -p src

しかし、私は次のエラーが発生しています

(ノード:13640) UnhandledPromiseRejectionWarning: 未処理のプロミス拒否 (拒否 ID: 2): TypeError: 'instanceof' の右側はオブジェクトではありません (ノード:13640) DeprecationWarning: 未処理のプロミス拒否は非推奨です。今後、処理されないプロミスの拒否は、ゼロ以外の終了コードで Node.js プロセスを終了します。

誰かがそれを解決する方法を教えてもらえますか

これは私のディレクトリ構造です

このリンクで指示されたように、tsconfig.json をルートから src フォルダーに移動しました

ディレクトリ構造

それが私が約束を使用している方法です

私は次のような約束を返すサービスを作成しました:

public get(servicename: string) {
    this.colorlog.log('get ' + servicename + " ",enmMessageType.Info);
    return this.http.get(this.ngWEBAPISettings.apiServiceBaseUri + "api/" + servicename + "/", this.ngWEBAPISettings.getConfig()).toPromise();
}

そして、このようなコンポーネントでそれを消費します

get() {
    var promise = this.setupServicePromise.get(this.SERVICE_NAME);

    promise.then((response: any) => {
      this.colorlog.log('in then promise ProductComponent get' + response,   enmMessageType.Data);
      this.vm.Products = response.json();
    }).catch((error: any) => {
      this.colorlog.log("Error Occurred in product", enmMessageType.Error);
    });
}

これは私の ts.config ファイルです。

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  }
}
4

1 に答える 1

1

次の手順でこれを達成しました

初め

MrJSinghが言及したようにバージョンを更新しました

package.jsonの依存関係セクションを更新すると、このようになります。

"dependencies": {
  "@angular/common": "~2.4.0",
  "@angular/compiler": "~2.4.0",
  "@angular/compiler-cli": "^2.4.1",
  "@angular/core": "~2.4.0",
  "@angular/forms": "~2.4.0",
  "@angular/http": "~2.4.0",
  "@angular/platform-browser": "~2.4.0",
  "@angular/platform-browser-dynamic": "~2.4.0",
  "@angular/router": "~3.4.0",
  "core-js": "^2.4.1",
  "rxjs": "5.0.1",
  "zone.js": "^0.7.4"
},

2番

その後、app.module.tsファイルを変更し、 useValueをuseFactoryに変更しました。

これを変える

let authService = new AuthService(new LocalStorage());
providers: [
  {provide:AuthService,useValue:authService},
  AdminAuthGuard,
  UserAuthGuard,
  SetupServicePromise,
  SetupServiceObservables
]

これに

export function authServiceFactory() {
  return new AuthService(new LocalStoragee());
}

providers: [
  {provide:AuthService,useFactory:authServiceFactory},
  AdminAuthGuard,
  UserAuthGuard,
  WebAPISettings,
  LoginService,
  SetupServicePromise,
  SetupServiceObservables
]

最後に、これら 2 つの手順の後、コマンドが正常に実行されます。

ノート

最新バージョンでは、プロバイダーの代わりに宣言を使用します

declarations: [
  {provide:AuthService,useFactory:authServiceFactory},
  AdminAuthGuard,
  UserAuthGuard,
  WebAPISettings,
  LoginService,
  SetupServicePromise,
  SetupServiceObservables
]

詳細については、このリンクを確認してください

于 2017-01-03T16:05:10.253 に答える