子メソッドからプロバイダメソッドにアクセスする@Input setter - Ionic2/Angular2

Question

私のコンポーネント@Inputメソッドからプロバイダクラスにアクセスしようとしています。 @Input方法は、次の

に呼び出されたときに、プロバイダが利用できないようにしかし、それはそう問題はライン

this.provider.sampleMethod();

I「はエラーである

#provider 
import { Injectable } from '@angular/core'; 
import 'rxjs/add/operator/map'; 


@Injectable() 
export class MyProvider { 

    constructor() {} 

    sampleMethod(){ 
    return 'sample method'; 
    } 
} 

#component 
import { Component, Input } from '@angular/core'; 
import {MyProvider} from '../../providers/my-provider/my-provider'; 
import { NavController} from 'ionic-angular'; 

@Component({ 
    selector: 'selected-options', 
    templateUrl: 'build/components/selected-options/selected-options.html', 
    inputs: ['node'] 
}) 
export class SelectedOptions { 

    provider: MyProvider; 

    @Input() 
    set node(n: any){ 
    this.provider.sampleMethod();  
    } 
} 

#page (where I call the component) 
<selected-options [node]="node.Name"></selected-options> 

私のコードであるようです取得はORIGINAL EXCEPTION: TypeError: Cannot read property 'sampleMethod' of undefinedです。

@Inputメソッドが呼び出されたときにprovider: MyProvider;がロードされないと思います。しかし、これはコンストラクタ内で使用するとうまく動作します。 @Inputメソッド内でプロバイダメソッドにアクセスするにはどうすればよいですか？

Answer 1

をホープが、エラーますあなたのクラスにはプロバイダ

import {YourProviderWithInjectableDecorator} from 'somepath'; 

    ionicBootstrap(MyApp, [YourProviderWithInjectableDecorator]) 

を追加プロバイダがコンストラクタにパラメータとして含まれていないためです（そのため、コンストラクタはMyProviderクラスのインスタンスを作成していません）。

this plunkerをご覧ください。たとえそこにいても、@InputセッターインターセプタでmyProviderインスタンスを使用しても、コンストラクタはすでにサービスのインスタンスを作成しているので、問題なくsampleMethod()を呼び出すことができます。あなたは自分のコンストラクタでprivate myProvider: MyProviderパラメータを追加する場合

import { Component, Input } from "@angular/core"; 
import { MyProvider } from './my-provider.ts'; 

@Component({ 
    templateUrl:"child.html", 
    selector: 'child-selector', 
    inputs: ['node'] 
}) 
export class ChildPage { 

    private result: string; 

    @Input() 
    set node(node: string){ 
    // Because the provider instance is injected on the constructor, we can 
    // call the sampleMethod() here 
    node = node + ' from ChildPage'; 
    this.result = this.myProvider.sampleMethod(node); 
    } 

    // Injects an instance of the MyProvider class 
    constructor(private myProvider: MyProvider) { 

    } 
} 

だからあなたのコードが動作するはず罰金:)

Answer 2

あなたのプロバイダにアクセスするには、そのアプリについて伝える必要があります。アプリをブートストラップしているとき、あなたのapp.tsにionic2については、

Component({ 
    selector: 'selected-options', 
    templateUrl: 'build/components/selected-options/selected-options.html', 
    inputs: ['node'] 
}) 
export class SelectedOptions { 

    constructor(private provider: MyProvider){} 

    @Input() 
    set node(n: any){ 
    this.provider.sampleMethod();  
    } 
} 

が、それはそれは混乱に聞こえるかもしれ