2014-04-22 13 views
9

Tôi đang sử dụng $ location.path() để tải chế độ xem mới trong trang web góc của tôi. Trang của tôi trông giống như:Tải trước ng-view để điều hướng mượt mà hơn

<html> 
<head> 
</head> 
<body> 
<div data-ng-view="" ></div> 
</body> 
</html> 

Và tôi thay đổi ng-view tùy theo nhu cầu (chỉ mục, trang chủ, đăng nhập, v.v ...). Một số lần điều hướng có vẻ chậm (một số trục trặc ở lại trong trang trong khi 0,1 giây) có cách nào để thực hiện điều hướng tức thời không?

Ngoài ra, tôi đã thử tính năng ng-animate giúp cải thiện cảm giác đó nhưng không hoàn toàn. Tôi đoán rằng gia tải 'views' của tôi sẽ là một giải pháp ..

Edit:

Feeling được cải thiện bằng cách thêm:

myApp.run(function ($templateCache, $http) { 
     $http.get('Template1.html', { cache: $templateCache }); 
    }); 

Trả lời

3

Nhờ Baba. Nhưng tôi tìm thấy một giải pháp không liên quan đến việc thay đổi tuyến đường của tôi (và sử dụng một thư viện khác như Bộ định tuyến Giao diện Người dùng Góc (đó là theo cách siêu!))

Giải pháp của tôi: tải trước các mẫu của tôi với $ templateCache và thêm hoạt ảnh (nice tuto: http://scotch.io/tutorials/javascript/animating-angularjs-apps-ngview + http://daneden.github.io/animate.css/)

5

Bạn có thể sử dụng một thư viện cao hơn nhiều so với việc quản lý quốc gia và quan điểm như vậy là Angular UI Router.

Nó hỗ trợ tải trước từng tài nguyên cần thiết trong trạng thái lồng nhau trước khi hiển thị nó (thông qua thuộc tính resolve), để tránh nhấp nháy giao diện, nhưng bạn cũng có thể tải từng tài nguyên mà bạn muốn riêng lẻ sau bạn đã hiển thị chế độ xem của mình. Nếu bạn không muốn cấu trúc lại ứng dụng của mình để sử dụng ui-router (điều này làm cho mọi ứng dụng dễ quản lý hơn), thì bạn sẽ bị mắc kẹt khi sử dụng $ templateCache và quản lý tài nguyên theo cách thủ công.

Bí quyết bạn có thể thử làm là cho phép trình điều khiển của khung nhìn tải các tài nguyên cần thiết sau khi được hiển thị. Ngoài ra, có thể bạn đã lặp lại các phần của chế độ xem ứng dụng một cách khôn ngoan, hãy thử trích xuất chúng trong các mẫu riêng biệt và sử dụng lại chúng nếu bạn có thể. Nếu bạn có thể chia ứng dụng của mình theo cách không thể hiển thị lại mọi thứ mỗi khi bạn thay đổi chế độ xem, nó có thể có tác dụng có lợi trên tốc độ hiển thị.

+0

Tôi đã tìm thấy thông tin về nó ([link] (http://stackoverflow.com/questions/21023763/difference-between-angular-route-and-angular-ui-router)) . Nhưng nó không nói nếu router ui góc nhanh hơn ngRoute – BironDavid

+0

Nó có thể cấu hình tốt hơn và khả năng tổng thể tốt hơn (mọi thứ được thực hiện dễ dàng hơn và theo cách dễ quản lý hơn). Nó không nhất thiết phải nhanh hơn, nhưng nó dễ quản lý hơn và nói chung sẽ dẫn đến một mã có cấu trúc tốt hơn. Và trong mã có cấu trúc tốt hơn, việc xác định vấn đề hiển thị dễ dàng hơn. Tuy nhiên, nó không phải là một viên đạn ma thuật sẽ tự động tăng tốc độ ứng dụng của bạn. Nó chỉ là một thay thế tốt hơn một chút của ngRoute. –

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