Angular2コントロールをプロバイダーとして組み込む必要があるのはなぜですか？

Question

私はAngularを学習しようとしており、おそらく非常に単純な問題に遭遇しました。

"PageSelectorComponent"というグリッドページングを行うための子コンポーネントを作成しました。このコンポーネントは合計レコード数を取得し、ページリンクを計算して表示します（このコンポーネントではプロバイダは使用されません）。私はこのコンポーネントを "TestComponent"と呼ばれる別のコンポーネントの中に埋め込んでいます。

PageSelectorComponentとTest Componentは、私のapp.module.tsファイルのdelarations部分に含まれています。私は除いてすべてが正常に動作しますapp.module.tsのプロバイダセクションにPageSelectorComponentを追加した場合、今、私は部品の2つのインスタンスを得る

ERROR Error: Uncaught (in promise): Error: No provider for PageSelectorComponent! 

：

私の問題は、私は次のエラーを取得するということです。これは私のサブスクリプションが動作しない原因になります。

PageSelectorComponentとTestComponentがどのように宣言されているかを見てきましたが、違いは見られません。

なぜアプリケーションがPageSelectorComponentをプロバイダとしてリストアップしないと不平を言っているのですか？私が言ったように

@Component({ 
    moduleId: module.id, 
    selector: 'app-page-selector', 
    templateUrl: './page-selector.component.html', 
    styleUrls: ['./page-selector.component.css'], 
}) 

export class PageSelectorComponent { 
    // member variables declared here 
    . 
    . 
    private static instanceNum: number = 0; // TOOD: debugging 

    constructor() { 
    PageSelectorComponent.instanceNum += 1; 
    console.log(`page-selector instance number ${PageSelectorComponent.instanceNum}`) 
    this.subject = new Subject(); 
    } 

が、私はいくつかの本当に基本的な存在だと思います。ここでは

@NgModule({ 
    declarations: [ 
    AppComponent, 
    NavigationComponent, 
    HomeComponent, 
    PageSelectorComponent, 
    TestComponent, 
    ], 
    imports: [ 
    BrowserModule, 
    RoutingModule, 
    ], 
    providers: [ 
    PageSelectorComponent // App complains if I leave this out but now I get 2 instances of the component. 
    ], 
    bootstrap: [AppComponent] 
}) 

がPageSelectorComponentの定義である：ここで

は私app.modules.tsのNgMoudle部であり、私はここで逃した角の事。見た目の提案はありますか？

ありがとうございます！

Answer 1

これに私をまっすぐに設定してくれたmasterpreenzに感謝します。

私は角を理解する方法でスレッドを閉じるためにこれに答えます。私はこれに新しいので、まだ間違っているかどうか教えてください！

予想通り、これは主語/オブザーバーパターンの基本的な誤解でした。それが判明したとき、私はcomponent1内から新しいSubjectを作成しようとしていましたが、もう1つのcomponent2を観察してクリックに反応させるつもりでした。 component1の件名にアクセスするには、コンストラクタでcomponent2をインスタンス化する必要があります。

constructor(private pager: coomponent1) {} 

（それが注入されているので）これは私がapp.moduleの両方の宣言とプロバイダセクションに含める必要な理由であるサービスのようなコンポーネント1扱います。

これを行う方法（私は唯一の方法ではないでしょう）は、ロジックを処理するサービスを作成することです。コンポーネント1は、クリックされたときにサービスを呼び出すことができます。コンポーネント2はサービスにサブスクライブすることができます。

効果的にこれにより、コンポーネント2はコンポーネント1からのクリックに反応することができます。