Giá trị thay đổi trên Dịch vụ AngularJS không kích hoạt đồng hồ trong chỉ thị

Question

Tôi đang gặp sự cố khi xem đồng hồ hoạt động trong chỉ thị. Tôi đã đặt cùng một ví dụ đơn giản ở đây. http://plnkr.co/edit/A7zbrsh8gJhdpM30ZH2P

Tôi có một dịch vụ và hai chỉ thị. Một chỉ thị thay đổi một thuộc tính trong dịch vụ và một chỉ thị khác có một chiếc đồng hồ trên thuộc tính đó. Tôi hy vọng chiếc đồng hồ sẽ cháy khi tài sản bị thay đổi nhưng nó không.

Tôi đã nhìn thấy một vài câu hỏi khác như thế này trên trang web, nhưng các giải pháp được chấp nhận trên chúng chưa hoạt động ở đây. Tôi đã xem xét sử dụng $ phát sóng hoặc cố gắng thực hiện một người quan sát, nhưng có vẻ như điều này sẽ hiệu quả và tôi không muốn làm mọi thứ phức tạp hơn nếu có thể.

Answer 1

Thay vì

this.currentObject = newObject; 

sử dụng

angular.copy(newObject, this.currentObject); 

Với mã gốc, chỉ thị viewer đang theo dõi các đối tượng gốc, {}. Khi currentObject được đặt thành newObject, đồng hồ $ vẫn đang tìm kiếm thay đổi đối với đối tượng gốc, không phải là newObject.

angular.copy() sửa đổi đối tượng gốc, vì vậy đồng hồ $ thấy thay đổi đó.

Answer 2

Câu trả lời của Mark Rajcok chưa hoàn thành. Ngay cả với angular.copy(), $ watch listener sẽ được gọi một lần và không bao giờ trở lại.

Bạn cần phải $ xem một hàm:

$scope.$watch(

    // This is the important part 
    function() { 
    return demoService.currentObject; 
    }, 

    function(newValue, oldValue) { 
    console.log('demoService.currentObject has been changed'); 
    // Do whatever you want with demoService.currenctObject 
    }, 
    true 
); 

Ở đây plunker rằng hoạt động: http://plnkr.co/edit/0mav32?p=preview

Mở giao diện điều khiển trình duyệt của bạn để thấy rằng cả hai chỉ thị và demoService2 được thông báo về những thay đổi demoService.currentObject .

Và btw angular.copy() thậm chí không cần thiết trong ví dụ này.