2013-08-17 54 views
0

我有使用angular-ui的角度應用程序。我需要模態窗口。我的模態窗口的模板:Angular-ui模態窗口只打開一次

<div modal="shouldBeOpen" close="close()" options="opts"> 
     <div class="modal-header"> 
      <h3>Create new entry</h3> 
     </div> 
     <div class="modal-body" ng-repeat="e in create_elements"> 
      {{e}} 
     </div> 

     <div class="modal-footer"> 
      ... 
     </div> 
</div> 

和處理程序打開和關閉:

$scope.open = function(){   
    $scope.shouldBeOpen = true; 
} 


$scope.close = function(){   
    $scope.shouldBeOpen = false; 
} 

但它僅打開1次,之後單擊打開按鈕不會做任何影響。如何解決它?

謝謝。

回答

0

我已經創建了另一個嘗試jsfiddle W /代碼類似於你的。應該注意的是,點擊外部模態呼叫close()但是我已經包含了一個按鈕,以提高清晰度。代碼幾乎保持不變。

http://jsfiddle.net/priyaranjan/dDjWe/

標記

<div ng-app="myApp" ng-controller="myCtrl"> 
    <button class="btn" ng-click="open()">Open me!</button> 
    <div modal="shouldBeOpen" close="close()" options="opts"> 
     <div class="modal-header"><h3>Create new entry</h3></div> 
     <div class="modal-body">body</div> 
     <div class="modal-footer"> 
      <button class="btn btn-warning cancel" ng-click="close()">Cancel</button> 
     </div> 
    </div> 
</div> 

的JavaScript

angular.module('myApp', ['ui.bootstrap']) 
    .controller('myCtrl', 
     function($scope){ 

      // code from so post 
      $scope.open = function(){ 
       $scope.shouldBeOpen = true; 
      }; 

      $scope.close = function(){ 
       $scope.shouldBeOpen = false; 
      }; 
     } 
); 

隨意籤angular documentation for modal