2012-12-13 32 views
30

Có thể là một trường hợp phổ biến mà chúng ta cần hiển thị thông báo lỗi/thành công cho người dùng sau khi cập nhật/tạo một số dữ liệu, làm thế nào chúng ta có thể thực hiện nó trong AngularJS?
Tôi muốn thêm cuộc gọi lại nhưng không thể tìm thấy giải pháp. Sử dụng $ http.post(). Success(). Error() hoạt động, nhưng tôi tự hỏi liệu tôi có thể làm điều đó với tài nguyên API $ lever cao hơn không.
Hoặc, chúng ta nên viết chỉ thị hoặc sử dụng $ watch()?
Cảm ơn sự giúp đỡ của bạn trước.

Trả lời

50

Actions từ lớp Resource thể được thông qua thành công và lỗi callbacks giống như cấp dưới $ http dịch vụ

From the docs

  • HTTP GET "lớp" Hành động: Resource.action ([tham số], [thành công], [lỗi])
  • hành động "class" không được phép: Resource.action ([tham số], postData, [success], [error])

Hành động không nhận tiền được bắt đầu bằng $.

Vì vậy, bạn có thể làm điều này

User.get({userId:123}, function(u, getResponseHeaders){ 
    // this is get's success callback 
    u.abc = true; 
    u.$save(function(u, putResponseHeaders) { 
    // This is $save's success callback, invoke notification from here 
    }); 
}); 

Edit: đây là another example from a previous plunker. Yêu cầu get sẽ thất bại vì nó yêu cầu một tệp json không tồn tại. Cuộc gọi lại lỗi sẽ được chạy.

someResource.get(function(data){ 
    console.log('success, got data: ', data);  
}, function(err){ 
    alert('request failed'); 
}); 
+0

Rất cám ơn! Câu hỏi tiếp theo là làm thế nào để bọc dữ liệu vào dữ liệu biểu mẫu? giải pháp trong [bài đăng này] (http://stackoverflow.com/questions/12190166/angularjs-any-way-for-http-post-to-send-request-parameters-instead-of-json) dường như không hoạt động cho các phương thức tài nguyên (có thể làm việc với $ http.put). thanks – Edward

+0

comment = Comment.save ($ scope.newComment, (response) -> console.log ("Comment submitted."))) cũng hoạt động. – mikeborgh

+0

Định dạng cho các hành động không nhận được là Resource.action ([tham số], postData, [thành công], [lỗi]) .. Nhưng trong ví dụ của bạn nó khác u. $ Save (function (u, putResponseHeaders) {.. ......... – Aakash

5

Với phiên bản AngularJS mới nhất, bạn có thể có một cái nhìn vào $interceptors mà là một phần của $httpProvider.

Sau đó, bạn có thể đánh chặn TẤT CẢ các yêu cầu trước khi gửi đi hoặc sau phản hồi.

angular.module('app').config(function($httpProvider){ 

    $httpProvider.interceptors.push(function($q) { 
    return { 
     'request': function(config) { 
     console.log('I will send a request to the server'); 
     return config; 
     }, 

     'response': function(response) { 
     // called if HTTP CODE = 2xx 
     console.log('I got a sucessfull response from server'); 
     return response; 
     } 

     'responseError': function(rejection) { 
     // called if HTTP CODE != 2xx 
     console.log('I got an error from server'); 
     return $q.reject(rejection); 
     } 
    }; 
    }); 

}); 

Lưu ý rằng bạn phải trả lại config hoặc response để làm cho nó làm việc.

Trong trường hợp rejection, bạn cần phải trả lại từ chối hoãn lại để có được $http.get().error() vẫn hoạt động sau khi bị chặn.

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