2017-12-25 13 views
0

Angular2 코드를 사용하여 Bootstrap4 Beta2 모델 팝업을 어떻게 팝업 할 수 있습니까? 내가 jQuery 코드 이를 사용하는 와나 그나마 여기 는angular2 어떻게 열지 Bootstrap4 beta2 modelpopup

<div class="modal" tabindex="-1" role="dialog"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <h5 class="modal-title">Modal title</h5> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
         <span aria-hidden="true">&times;</span> 
        </button> 
       </div> 
       <div class="modal-body"> 
        <p>Modal body text goes here.</p> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-primary">Save changes</button> 
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
       </div> 
      </div> 
     </div> 
    </div> 

답변

0

당신은 바로 그런 쇼와 같은 기존의 방법을 사용하고 숨길 수 있습니다 getbootstrap.com에서 내가 복사하는 코드입니다

<div class="modal fade" bsModal #staticModal="bs-modal" [config]="{backdrop: true}" 
     tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true"> 
     <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <h4 class="modal-title pull-left">Static modal</h4> 
      <button type="button" class="close pull-right" aria-label="Close" (click)="staticModal.hide()"> 
       <span aria-hidden="true">&times;</span> 
      </button> 
      </div> 
      <div class="modal-body"> 
      This is static modal, backdrop click will not close it. 
      Click <b>&times;</b> to close modal. 
      </div> 
     </div> 
     </div> 
    </div> 

DEMO