Angularjs NG-含ん無効ブートストラップモーダル（）

Question

私はdiv要素を持つHTMLページがあります。

<div id="divLogin" ng-include="'App_2/View/login.html'"></div> 

そして、私のlogin.htmlと：私はからのメソッド呼び出しshowModal私のコントローラで

<div class="modal fade" id="myLoginModal" role="dialog"> 
    <div class="modal-dialog" ng-controller="loginCtrl"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Login</h4> 
      </div> 
      <div class="modal-body"> 
       <h5 id="lblLoginError" class="alert-info">{{errorMessage}}</h5> 
       <div class="form-group"> 
        <label for="User" class="sr-only">User</label> 
        <input type="text" name="User" id="LoginUser" ng-model="userName" class="form-control" placeholder="User"> 
       </div> 
       <div class="form-group"> 
        <label for="key" class="sr-only">Password</label> 
        <input type="password" name="key" id="LoginPassword" ng-model="password" class="form-control" placeholder="Password"> 
       </div> 
       <button class="btn btn-success" data-loading-text="Loading..." id="btnLogin" ng-click="login()">Login</button> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" ng-click="hideModal()">Close</button> 
      </div> 
     </div> 
    </div> 
</div> 

を私loginModalサービス：私は直接divLoginにlogin.htmlとHTMLを追加する場合

app.factory('loginModal', function() { 

    var loginBtn = angular.element("#btnLogin"); 
    var loginModal = angular.element('#myLoginModal'); 

    return { 
     resetBtn: function() { 
      loginBtn.button('reset'); 
     }, 

     loadBtn: function() { 
      loginBtn.button('loading'); 
     }, 

     showModal: function() { 
      loginModal.modal('show'); 
     }, 

     hideModal: function() { 
      loginModal.modal('hide'); 
      loginBtn.button('reset'); 
     } 
    }; 
}); 

すべてが正常に動作し しかし、私がng-includeを使うと、modal（）を呼び出すときにモデルが開かない。 angular.element('#myLoginModal')は、どちらの場合でも要素を取得しますので、モーダルは正しく表示されます。

ブートストラップのモーダル（）関数を再バインドする必要がありますか、ここでは何が欠けていますか？

Answer 1

変数は、ng-includeによってモーダルのレンダリングが完了する前にインスタンス化されているようです。モーダルオブジェクトが私のサービス変数にレンダリングされていることを知ることができたとしても、何らかの形でゴミが出ていました。 サービスメソッドでそれらをリセットした後で、ng-includeにログインビューをロードするとすべてうまくいきました。

作業溶液：

showModal: function() { 
    loginModal = angular.element('#myLoginModal'); 
    loginModal.modal('show'); 
},