2013-10-19 26 views
10

Tôi không thể tìm thấy dịch vụ $dialog trong AngularUI và tôi đã cố gắng khám phá một đơn giản messageBox() để tạo hộp thoại xác nhận bằng cách sử dụng $modal. Không thể tìm thấy điều đó.

Ai đó có thể gợi ý cho tôi cách tạo một hộp thoại đơn giản (cho xác nhận xóa) bằng AngularJS/AngularUI?

Cảm ơn bạn trước.

Trả lời

20

Dịch vụ $dialog được cấu hình lại thành $modal cho phiên bản 0.6.0 của ui-bootstrap. Chức năng từ $dialog sẽ vẫn có sẵn, chỉ cần thông qua $modal thay thế.

Theo docs, bạn nên chắc chắn rằng bạn đã bao gồm bootstrap của cssangular.js trong trang của bạn cũng như bootstrap-ui của JS, mà bạn có thể tải về từ trang web doc. Tôi muốn xem liên kết 'tạo của riêng bạn' nếu bạn chỉ cần sử dụng dịch vụ $modal chứ không phải các chỉ thị khác.

Nếu các tệp này được đưa vào trang của bạn, hãy đảm bảo định nghĩa mô-đun góc của bạn bao gồm ui.bootstrap làm phụ thuộc. ví dụ.

var app = angular.module('myApp', ['ui.bootstrap']); 

Nếu điều này được thực hiện thì bạn có thể tiêm dịch vụ $modal trong mô-đun của mình, như bạn làm với bất kỳ dịch vụ nào khác.

app.controller('myController', function($scope, $modal) { 
    $scope.openModal = function() { 
     // Can use $modal service as per examples in doc page 
    }; 
}); 

Ví dụ cụ thể, trang tài liệu có các ví dụ tuyệt vời trên trang và trong plunker (để bạn có thể chơi với chúng) cho từng dịch vụ và chỉ thị của chúng. Tôi muốn liên kết với kẻ cướp ở đây, nhưng tôi dường như không thể.

+1

Cảm ơn bạn đã phản hồi nhanh. Hộp thoại $ có một phương thức có tên là MessageBox(), không có mặt với dịch vụ $ modal. Tôi chỉ muốn tạo một hộp xác nhận đơn giản, có cách nào khác ngoại trừ việc sử dụng $ modal.open() không? –

+6

Có, thật không may điều này không tồn tại nữa và có một [vấn đề mở] (https://github.com/angular-ui/bootstrap/issues/996) về việc thêm hướng dẫn di chuyển. Một trong những ý kiến ​​(https://github.com/angular-ui/bootstrap/issues/996#issuecomment-25388935) có một dịch vụ ví dụ sử dụng '$ modal' có thể làm những gì bạn muốn, nếu không bạn sẽ cần phải hạ cấp bootstrap-ui hoặc viết dịch vụ của riêng bạn với cùng chức năng. – Andyrooger

+0

Cảm ơn bạn đã phản hồi nhanh! :-) –

Các vấn đề liên quan