9

Ionic2 フレームワークを使用した Angular2 の Injectable Service に問題があります。

私のサービスは次のようになります。

import {Injectable} from '@angular/core';
import {NavController} from 'ionic-angular';

@Injectable()
export class ViewStackController {
  static get parameters() {
    return [[NavController]];
  }

  constructor(nav) {
  }
}

そして、エラーが発生しますNo provider for NavController。奇妙なことに、どの Page クラスでも機能していますが、それが問題な@Componentのかもしれません。

編集＃1：

このサービスはionicBootstrapで次のように提供しています。

ionicBootstrap(MyApp, [ViewStackController], {});
4

1 に答える 1

19

ここでわかるように、@mhartington (イオン チームから) は次のように述べています。

これを理解するために、ViewController または NavController を Service に注入するべきではありません。これは意図した目的ではありません。

と

このサービスは、アラートの表示/読み込み/、またはナビゲーションによってアクティブ化する必要があるコンポーネントを担当するべきではありません。サービスは、データを取得して返すためのものであるべきです。

それ以外は、コンポーネント内で行う必要があります。

そうは言っても、次のようにしてナビを取得できます

var nav = this.app.getActiveNav();

あなたがここで見ることができるように。

=================================================

編集：別のユーザーが言ったように：

ビューをサービスから変更するのは悪い習慣です (壊れた MVC)。ただし、サービスからメイン コントローラーにイベントを送信し、コントローラーで NavController を使用することも (最善の方法)、NavController を属性のようにサービスに送信することもできます (悪い方法ではありません...)。または、サービスを使用する代わりに、コンポーネントを作成する必要がある場合があります。

したがって、それを行うより良い方法は次のようになります。

まず、サービスに を追加しobservableて、 をいつdismiss呼び出す必要があるかを確認します。

import {Injectable} from '@angular/core';
import {Platform} from 'ionic-angular';
import {Observable} from 'rxjs/Observable';

@Injectable()
export class MyCustomService {

  // Observables we're going to use
  private dismissObserver: any;
  public dismiss: any;

  constructor(private platform: Platform){
    // Your stuff
    // ...

    this.dismissObserver = null;
    this.dismiss = Observable.create(observer => {
        this.dismissObserver = observer;
    });
  }

  public yourMethod(...):void {
    // Here we send the order to go back to the home page
    this.dismissObserver.next(true);
  }
}

そして、あなたの（またはあなたの最上位のコンポーネント）でのみ：app.ts

 initializeApp(): void {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();

      // We subscribe to the dismiss observable of the service
      this.myCustomService.dismiss.subscribe((value) => {
        this.navController.setRoot(HomePage);
      });
    });
  }

アプリの に忘れずに追加してionicBootstrapください。

ionicBootstrap(MyApp, [MyCustomService, ...], {
  //statusbarPadding: true
});

または、Angular2 Style Guideproviderに従って、最上位のコンポーネント (この場合は MyApp) に追加します。

@Component({
  templateUrl: 'build/app.html',
  directives: [...],
  providers: [MyCustomService]
})
class MyApp {
  // ...
}
于 2016-06-15T11:49:43.123 に答える