2017-09-25 26 views
0

angularJsに問題があります。 ポップアップを開いてポップアップにボタンを動的に追加した後、ボタンイベントをトリガーする方法がわかりません。 私はほとんど「すべて」を試みました。ここでポップアップで動的に追加されたボタンのAngularJSイベント

は一例です:https://plnkr.co/edit/QfnDttJE2OnfHzt65tBQ?p=preview

+1

ますanglejsのようなものを追加するべきではありません、あなたはjQueryの方法でそれをやっています - DOMに要素を追加する。あなたのボタン、すなわちbtnArray(オブジェクトのリストのみ)のリストを取るコントローラ上の配列変数をいくつか設定してから、ボタン要素のbtnArrayをng-repeatし、その配列のすべてをあなたのモーダルに表示してみてください。 – pegla

答えて

0

は、[OK]をクリックして、コードを考えると、それは少し改善することができたが、これは固溶体のようになります。 https://plnkr.co/edit/UiOsyHBjVZTW33yr6h3z?p=preview

Javascriptを:

app.controller('ModalInstanceCtrl', function ($uibModalInstance,$compile) { 
     var $ctrl = this; 
     $ctrl.buttonArray = []; 

     $ctrl.cancel2 = function() { 
     $uibModalInstance.dismiss('cancel');  
     }; 

     $ctrl.add2 = function(){   
     $ctrl.buttonArray.push('message' + $ctrl.buttonArray.length) 
     }; 

     $ctrl.message = function() { 
     alert('Message'); 
     }; 

}); 

HTML:

<div ng-app="app" ng-controller="postoviCtrl as $ctrl"> 

     <script type="text/ng-template" id="modalOdabraniPost.html"> 

      <div class="modal-body"> 
         <p>Header</p> 
         <hr/> 
         <button class="btn btn-sm" type="button" ng-click="$ctrl.add2()">Add</button> 

         <div id="content"> 
          <button ng-repeat="btn in $ctrl.buttonArray" class="btn btn-primary btn-sm" type="button" ng-click="$ctrl.message()">{{btn}}</button>' 
         </div> 
      </div> 
      <div class="modal-footer"> 
       <button class="btn btn btn-primary" type="button" ng-click="$ctrl.cancel2()">Close</button> 

      </div> 
     </script> 

     <a href="" class="label label-danger" ng-click="$ctrl.open2()">Open</a> 

    </div> 
関連する問題