Giao diện người dùng góc Boostrap cung cấp dịch vụ - $dialog - có thể được tiêm bất cứ nơi nào bạn cần sử dụng hộp thoại. Dịch vụ đó có hai phương pháp chính: dialog và messageBox. Trước đây được sử dụng để tạo ra một hộp thoại với nội dung động và sau đó để tạo ra một hộp thông điệp với một tiêu đề, một tin nhắn và một tập hợp các nút. Cả hai đều trả về một lời hứa để bạn có thể xử lý kết quả của nó, khi nó có sẵn.
Tôi nghĩ rằng cách tiếp cận này hoạt động tốt, bởi vì nó phù hợp với cách tự nhiên, bắt buộc để xử lý các hộp thoại. Ví dụ, nếu người dùng nhấp vào một nút và bạn muốn hiển thị một hộp thoại và sau đó xử lý kết quả của nó, các mã có thể trông như thế này:
$scope.doSomething = function() {
$dialog.dialog().open().then(function(result) {
if (result === OK) {
// Process OK
}
else {
// Process anything else
}
});
}
Bạn thực sự có thể sử dụng chỉ thị để làm như vậy, và có lẽ nó có vẻ đúng cách để làm điều đó vì có thao tác DOM có liên quan, nhưng tôi nghĩ nó sẽ rất khó xử để xử lý nó. Ví dụ trước sẽ có dạng như sau:
<dialog visible="dialogVisible" callback="dialogCallback()"></dialog>
...
$scope.doSomething = function() {
$scope.dialogVisible = true;
}
$scope.dialogCallback = function(result) {
if (result === OK) {
// Process OK
}
else {
// Process anything else
}
}
IMO, ví dụ đầu tiên trông đẹp hơn và dễ hiểu hơn.
Nguồn
2013-08-29 17:01:34
Tôi thích phương pháp này tốt nhất. Thậm chí tốt hơn, ai đó đã dành thời gian để triển khai cơ bản bạn có thể bắt đầu từ: https://github.com/adamalbrecht/ngModal – joescii