How to use code to open a modal in Angular 2?

Question

Usually we use data-target=\"#myModal\" in the to open a modal. Right now I need use codes to control when to open the modal.

<

Answer 1

Easy way to achieve this in angular 2 or 4 (Assuming that you are using bootstrap 4)

Component.html

Open Modal


  

    

     

        
Title
        
            ×
        
      
      

        
Some text in the modal.
      
    
  

Component.ts

import {Component, OnInit, ViewChild} from '@angular/core';

@ViewChild('myModal') myModal;

openModel() {
  this.myModal.nativeElement.className = 'modal fade show';
}
closeModel() {
   this.myModal.nativeElement.className = 'modal hide';
}