角度2は関数varを別のコンポーネントに渡します

Question

私は角度2に新しいです、私は質問があります。 私はModalContentと呼ばれるコンポーネントとしてモーダルを作成し、その機能の一つである：

はどのように私は同じそれを使用するために、フォームと呼ばれる全く異なるコンポーネントで機能するモード成分で変数totalSelectedを渡すことができ

@Component({ 
selector: 'modal-content', 
templateUrl: './app/d-modal/d.modal.content.component.html', 
styleUrls: [ './app/d-modal/d.modal.content.component.css' ], 
providers: [InMemoryDataService], 
}) 
export class ModalContent { 
    totalSelected:number; 

    addM() { 
     let selected = this.m.filter((x) => x["selected"]); 
     let totalSelected = selected.length; 
     console.log(totalSelected); 
     this.activeModal.close('Close click'); 
    }} 

以下：

@Component({ 

moduleId: module.id, 
    selector: 'form', 
    templateUrl: 'form.component.html', 
    styleUrls: [ 'form.component.css' ], 
    directives : [ModalContent],` 

})` 

export class FormComponent { 
@ViewChild(ModalContent) childComp: ModalContent; 
    addMForm() { 
     const modalRef = this.modalService.open(ModalContent); 
     modalRef.componentInstance.name = 'World';` 
     this.childComp.addM(); 

    for (var m = 0; m < totalSelected; m++) 
    { 
     let newGroup = new FormGroup({ 
      A :new FormControl(), 
      B: new FormControl(), 
      C: new FormControl(), 
      D :new FormControl() 
     }); 



     this.Form.controls.users.push(newGroup); 
    }} 

} 

私が達成したい事は、ユーザiがキャプチャしたいモード成分で選択したものは何でもので、モーダルコンポーネントにおける選択の数に基づいて、私のフォーム内のフィールドの数を作成することです

totalselected変数の数値をフォームコンポーネントにプッシュし、（ for）をカウンタとして使用しても動作しません。

Answer 1

他のコンポーネントが子コンポーネントの場合は、@inputデコレータを使用して、親コンポーネントと子コンポーネントの間でデータを渡すことができます。私はthisを参考にしてください。また、totalselectedは、指定した関数の範囲内にのみ存在するので、関数から返すか、関数定義の前に作成することができます。また、あなたの関数がモーダルにあると述べたので、モーダルを他のコンポーネントの子にして@outputデコレータを使用する方が理にかなっているかもしれません。

編集 - あなたはこの

totalSelected: number; 
addM() { 
let selected = this.m.filter((x) => x["selected"]); 
this.totalSelected = selected.length; 
console.log(totalSelected); 
this.activeModal.close('Close click'); 
} 

ような何かを行うことができます今、選択された変数の合計は、関数呼び出しのスコープの外で利用可能です。