title: Getting error $(...).modal is not a function in angularjs after upgraded bootstrap 3.3.6 to 4.0.0
body: <p>After upgrading the bootstrap in my application from 3.3.6 to 4 I started getting error error $(...).modal is not a function, which(modal) was previously working fine. Error</p>
  
  <pre><code>angular.js:14700 TypeError: $(...).modal is not a function
  at ReviewQueueController.js?V=1.2:122
  at angular.js:20440
  at completeOutstandingRequest (angular.js:6362)
  at angular.js:6642
  </code></pre>
  
  <p>I am using angular js. when there is a success, error or any info I use modal. I have tried to replicate the issue with fiddle.</p>
  
  <p>I have just started working  on angular so i am not sure how to fix.</p>
  
  <p><a href="http://jsfiddle.net/ADukg/15913/" rel="nofollow noreferrer">Fiddle Link</a></p>
  
  <p>In many post i researched it was suggested to make changes to css </p>
  
  <pre><code>.fade.in {
    opacity: 1;
  }
  
  .modal.in .modal-dialog {
     -webkit-transform: translate(0, 0);
     -o-transform: translate(0, 0);
      transform: translate(0, 0);
   }
  
  .modal-backdrop.in {
      filter: alpha(opacity=50);
      opacity: .5;
   }
  </code></pre>
  
  <p>Also many link suggested to use noconflict like <a href="https://stackoverflow.com/questions/8586306/bootstrap-modal-is-not-a-function">here</a>. I am not sure how no conflict will work with angularjs</p>
  
  <p>please suggest what i can do to fix the issue</p>