Tôi có một sự kiện nhấp xảy ra ngoài phạm vi chỉ thị tùy chỉnh của mình, vì vậy thay vì sử dụng thuộc tính "ng-click", tôi đang sử dụng trình nghe jQuery.click () và gọi một hàm trong phạm vi của mình như vậy:

$('html').click(function(e) {
  scope.close();
);

close () là một hàm đơn giản trông như thế này:

scope.close = function() {
  scope.isOpen = false;
}

Theo quan điểm của tôi, tôi có một yếu tố với "ng-show" bị ràng buộc với isOpen như thế này:

<div ng-show="isOpen">My Div</div>

Khi gỡ lỗi, tôi thấy rằng close () đang được gọi, isOpen đang được cập nhật thành false, nhưng khung nhìn AngularJS không cập nhật. Có cách nào tôi có thể tự nói với Angular để cập nhật chế độ xem không? Hoặc có một cách tiếp cận "góc cạnh" hơn để giải quyết vấn đề này mà tôi không thấy?

Giải pháp là gọi ...

$scope.$apply();

... trong cuộc gọi lại sự kiện jQuery của tôi.

Tại sao $applynên gọi?

TL; DR : $applynên được gọi bất cứ khi nào bạn muốn áp dụng các thay đổi được thực hiện bên ngoài thế giới Angular.

Chỉ cần cập nhật câu trả lời của @ Dustin , đây là lời giải thích về việc $ áp dụng chính xác và lý do tại sao nó hoạt động.

$apply()được sử dụng để thực thi một biểu thức trong AngularJS từ bên ngoài khung AngularJS. (Ví dụ: từ các sự kiện DOM của trình duyệt, setTimeout, XHR hoặc thư viện của bên thứ ba). Bởi vì chúng tôi đang kêu gọi vào khung AngularJS, chúng tôi cần thực hiện vòng đời phạm vi thích hợp của việc xử lý ngoại lệ , thực thi đồng hồ .

Angular cho phép bất kỳ giá trị nào được sử dụng làm mục tiêu ràng buộc. Sau đó, khi kết thúc bất kỳ lượt mã JavaScript nào, nó sẽ kiểm tra xem giá trị đã thay đổi chưa. Bước đó kiểm tra xem liệu có bất kỳ giá trị ràng buộc nào đã thay đổi thực sự có phương thức không, $scope.$digest()¹ . Chúng tôi gần như không bao giờ gọi nó trực tiếp, vì chúng tôi sử dụng $scope.$apply()thay thế (sẽ gọi $scope.$digest).

Angular chỉ giám sát các biến được sử dụng trong các biểu thức và bất cứ thứ gì trong $watchcuộc sống bên trong phạm vi. Vì vậy, nếu bạn đang thay đổi mô hình bên ngoài bối cảnh Angular, bạn sẽ cần phải kêu gọi $scope.$apply()những thay đổi đó được lan truyền, nếu không Angular sẽ không biết rằng chúng đã bị thay đổi do đó ràng buộc sẽ không được cập nhật ² .

Sử dụng

$route.reload();

nhớ tiêm $routevào bộ điều khiển của bạn.