Rõ ràng Angular JS templateCache một lần (đối với mỗi lần triển khai)

Question

Vấn đề này AngularJS disable partial caching on dev machine đề xuất sử dụng $templateCache.removeAll() để xóa các mẫu bộ nhớ cache. Tuy nhiên, nếu bạn chỉ muốn kích hoạt tính năng này một lần theo từng chu kỳ triển khai để có được trình duyệt của khách truy cập làm mới/cập nhật mẫu? Vấn đề của chúng tôi là một số trình duyệt không cập nhật các tệp html mẫu, chúng tôi sẽ kết thúc với CSS mới được trộn lẫn với HTML cũ. Tôi không muốn chức năng này kích hoạt mọi lúc, điều đó sẽ đánh bại điểm của các mẫu bộ nhớ cache để bắt đầu (phải không?).

mỗi tiêu đề câu hỏi, một cách khuyến khích để xóa $ templateCache "một lần", ví dụ một số ý tưởng tôi đã kêu lạo xạo là những gì:

• Liệu góc có một phương pháp nội bộ phát hiện nếu mẫu tập tin đã thay đổi ? Và sau đó nếu có "cập nhật" nó.
• Góc có nội bộ "phiên bản" hoặc "ngày" chúng tôi có thể so sánh và thêm một điều kiện có chức năng lửa removeAll() không?
• $ templateCache có tự biết làm mới không? Ý định của người tạo ra Angular trong việc ép templateCache là gì nếu các tệp HTML bị ràng buộc thay đổi làm thêm giờ và được phân phát cho nhiều trình duyệt.

Tôi không muốn sử dụng grunt để bổ sung chi phí công việc cho điều gì đó xảy ra theo định kỳ, cũng như không cắt mẫu tệp html thành biến. (Is this a good method for template cache busting in angular?)

Cách thay thế tôi có thể thấy chỉ đơn giản là thêm và xóa mã removeAll() theo cách thủ công, điều đó sẽ ngớ ngẩn.

Answer 1

Chúng tôi đã quyết định chỉ đơn giản là truy cập phiên bản dấu thời gian UNIX vào các tệp đã được thay đổi như file.php?v=154325232. Lý do là chúng ta không thực sự sử dụng Angular templateCache, trong đó chúng ta không lưu trữ bản thân dữ liệu mẫu bên trong templateCache. Tôi nghĩ Angular tự động lưu trữ bất kỳ tập tin mẫu chỉ thị được tải async nào vào templateCache, điều đó không đúng, bạn phải sử dụng một cách rõ ràng templateCache để lấy một tệp (Hướng dẫn tốt về số https://thinkster.io/templatecache-tutorial).

Vì vậy, giải pháp của chúng tôi chỉ là phiên bản cũ của nhàm chán, điều này dễ hiểu nhất bởi các tiêu đề trình duyệt và cho các trang web không có quy mô lớn, tốt.

$modifiedTs = filemtime($filename); 
if ($modifiedTs != $lastModificationTs){ 
    echo "$filename?v=" . time(); 
} 

How to check if a file has changed?

Cuối cùng cách tôi đọc templateCache, của nó không có ý định để lưu dữ liệu giữa các phiên trình duyệt thay mình một dịch vụ bộ nhớ cache trong phiên. Nó không có gì để làm với bộ nhớ cache của trình duyệt, thay vì Angular lưu trữ nó trong nội bộ. Vì vậy, nó có nghĩa là cho các trang web tự động điều hướng và tải URL (ví dụ: không phải là một trang thực sự làm mới nhưng một thủ thuật AJAX) mà là hầu hết các trang web của Google ngày nay.

• Prevent browser cache of angular templates
• Best way to manually clear out $templateCache in AngularJS

Answer 2

Phương pháp phổ biến hiện nay là để tạo ra một nhiệm vụ sử dụng một mô-đun nút đó preprocesses mẫu kiễu góc vào một tập tin mà bạn thêm vào js stack.

Bạn có thể cài đặt gulp-ng-html2js và thực hiện tác vụ gulp. Điều này sẽ xuất ra một tập tin nói templates.js, sau đó bạn thêm vào đầu.
https://www.npmjs.com/package/gulp-ng-html2js

Sau đó gọi nó trong ứng dụng của bạn dưới dạng phụ thuộc vào mô-đun. app.module('myApp',['templates']);

Vì vậy, trước mỗi lần triển khai, hãy chạy tác vụ gulp này. Và nếu cần thêm chuỗi truy vấn bộ đệm truy cập bộ nhớ cache templates.js?v=123