Angular 2 - how to access directive and call a member function in it

19,790

This is old way,

@Directive({
    selector:   'someDirective'
})
export class  SomeDirective{         
    constructor() {}    
    render() {
       console.log('hi from directive');
    }
}

import {Component,ViewChild} from 'angular2/core';
import {SomeDirective} from '../../someDirective';
@Component({
    templateUrl: '....tem.html',
    directives: [SomeDirective]
})
export class SomeComponent {
      @ViewChild(SomeDirective) vc:SomeDirective;
      constructor(){}
      ngAfterViewInit(){
          this.vc.render();
      }
}

for newer version of Angular2, follow answer given here

Calling function in directive

Share:
19,790
VISHAL DAGA
Author by

VISHAL DAGA

Full Stack Developer

Updated on July 19, 2022

Comments

  • VISHAL DAGA
    VISHAL DAGA almost 2 years

    I have a directive like this -

    @Directive({
        selector:   'someDirective'
    })
    export class  SomeDirective{         
        constructor() {}    
        render = function() {}
    }
    

    and then I am importing the directive

    import {SomeDirective} from '../../someDirective';
    @Page({
        templateUrl: '....tem.html',
        directives: [SomeDirective]
    })
    export class SomeComponent {
          constructor(){}
          ngAfterViewInit(){//want to call the render function in the directive
    }
    

    In ngAfterViewInit, I want to call the render function in the directive. How to do this ?