2014-07-10 314 views
0

具有角我曾經是能夠做到這一點

var title = 'title'; 
var messageBody = 'message'; 
var buttons = [{ result: 'ok', label: 'OK', cssClass: 'btn-primary' }]; 
$dialog.messageBox(title, messageBody, buttons).open(); 

但現在,$對話框已替換爲$模式。

新計劃中的上述等價物是什麼?

+0

它在很好描述在模態指令的章節中的[documentation](http://angular-ui.github.io/bootstrap/)。 – Gamb

回答

1

使用$模式:

示例HTML:

<div> 
    <div class="modal-header"> 
     <h3 class="modal-title">{{data.title}}</h3> 
    </div> 
    <div class="modal-body"> 
     {{data.message}} 
    </div> 
    <div class="modal-footer"> 
     <button class="btn-primary" ng-click="ok()">Ok</button> 
    </div> 
</div> 

例JS:

var MyModalCtrl = function ($scope, $modal) { 

    $scope.title = 'I'm a Modal'; 
    $scope.message = 'Hello World'; 
    $scope.open = function() { 

    var modalInstance = $modal.open({ 
     templateUrl: '/path/to/html', 
     controller: MyModalInstanceCtrl, 
     size: 'lg', 
     resolve: { 
     data: function() { 
       return {title: $scope.title, message: $scope.message}; 
      } 
     } 
    }); 

    modalInstance.result.then(function (selectedItem) { 
     console.log('Closed'); 
    }); 
}; 

var MyModalInstanceCtrl = function ($scope, $modalInstance, data) { 

    $scope.data = data; 

    $scope.ok = function() { 
     $modalInstance.close(); 
    }; 

}; 

此文檔可以在這裏找到:http://angular-ui.github.io/bootstrap/