2017-06-27 3 views
2

Wie kann ich zu den acces Methode einer Komponente:Zugang zu Verfahren der spezifischen Komponente, da Eltern Angular 2

mein directive.ts:

import { Parent } from '../../_common/Parent'; 
declare var jQuery: any; 

@Directive({ 
    selector: '[icheck]' 
}) 

export class IcheckDirective implements AfterViewInit { 

    constructor(private el: ElementRef, private parentCmp: Parent) { 
    jQuery(this.el.nativeElement).iCheck({ 
     checkboxClass: 'icheckbox_square-aero', 
     radioClass: 'iradio_square-aero' 
    }).on('ifChecked', function(event) { 
     if (jQuery('input').attr('type') === 'radio') { 
    // Here how can I call method **selectType** of the component FolderComponent when I check I radio button parentCmp.selectType(jQuery('input[name="filters.type"]:checked').val()); 
     } 
    }); 
    } 
} 

mein Parent.ts

export abstract class Parent { 
} 

Meine Komponente.ts (mit icheck)

import { Component, OnInit, ViewContainerRef } from '@angular/core'; 
    import { ActivatedRoute, Router } from '@angular/router'; 
    import { Parent } from '../../_common/Parent'; 

    declare var jQuery: any; 

    @Component({ 
     selector: 'app-folders', 
     templateUrl: './folders.component.html', 
     providers: [{ provide: Parent, useExisting: FoldersComponent }] 
    }) 
    export class FoldersComponent implements OnInit, Parent { 

     name = 'FoldersComponent '; 

     constructor(
     private route: ActivatedRoute, 
     private router: Router, 
    ) { 
     } 

     ngOnInit() { 

     } 

     selectType(value: string) { 
     console.log(value); 
     } 
    } 

Hier können wir sehen, dass ich eine Methode „selectType“ in FoldersComponent haben, also wenn ich es nennen wollen, wenn ich Radio-Button

Antwort

2

überprüfen Sie können es wie folgt tun:

  if (jQuery('input').attr('type') === 'radio') { 
      // Here how can I call method **selectType** of the component FolderComponent 
      //when I check I radio button parentCmp.selectType(jQuery('input[name="filters.type"]:checked').val()); 

      parentCmp.selectType(); 
      } 

Wenn alle übergeordneten Komponenten die selectType Methode haben sollte, dann ändern Sie einfach die Parent Klasse und die Eigenschaft hinzufügen:

export abstract class Parent { 
    selectType() {} 
} 

Wenn einige Eltern es nicht haben, dann können Sie Typ any wie dies angeben und der Compiler den Fehler nicht erzeugen:

constructor(private el: ElementRef, @Inject(Parent) private parentCmp:any) { 
+0

Ja, es ist, was ich tue, aber ich habe diesen Fehler Zeichen 'Immobilien 'selectType' existiert nicht für den Typ 'Eltern'. – user1814879

+0

@ user1814879, siehe mein Update –

+0

Ja, es funktioniert gut .. thx so muchhh – user1814879

Verwandte Themen