Sự khác biệt giữa tuyến đường góc và bộ định tuyến góc là gì?

Tôi đang dự định sử dụng AngularJS trong các ứng dụng lớn của mình. Vì vậy, tôi đang trong quá trình tìm ra các mô-đun phù hợp để sử dụng.

Sự khác biệt giữa các mô-đun ngRoute (angular-route.js) và ui-router (angular-ui-router.js) là gì?

Trong nhiều bài viết khi ngRoute được sử dụng, tuyến đường được định cấu hình với $ routeProvider . Tuy nhiên, khi được sử dụng với ui-router , tuyến đường được định cấu hình với $ stateProvider và $ urlRouterProvider .

Tôi nên sử dụng mô-đun nào để quản lý tốt hơn và mở rộng?

ui-router là mô-đun của bên thứ 3 và rất mạnh. Nó hỗ trợ mọi thứ mà ngRoute bình thường có thể làm cũng như nhiều chức năng bổ sung.

Dưới đây là một số lý do phổ biến ui-router được chọn qua ngRoute:

• ui-router cho phép các khung nhìn lồng nhau và nhiều khung nhìn được đặt tên . Điều này rất hữu ích với ứng dụng lớn hơn, nơi bạn có thể có các trang kế thừa từ các phần khác.

• ui-router cho phép bạn có liên kết loại mạnh giữa các trạng thái dựa trên tên trạng thái. Thay đổi url ở một nơi sẽ cập nhật mọi liên kết về trạng thái đó khi bạn xây dựng liên kết của mình ui-sref. Rất hữu ích cho các dự án lớn hơn, nơi URL có thể thay đổi.

• Ngoài ra còn có khái niệm về trình trang trí có thể được sử dụng để cho phép các tuyến đường của bạn được tạo động dựa trên URL đang cố gắng truy cập. Điều này có thể có nghĩa là bạn sẽ không cần chỉ định tất cả các tuyến đường của mình trước khi thực hiện.

• trạng thái cho phép bạn ánh xạ và truy cập thông tin khác nhau về các trạng thái khác nhau và bạn có thể dễ dàng chuyển thông tin giữa các trạng thái thông qua $stateParams.

• Bạn có thể dễ dàng xác định xem bạn đang ở trong một trạng thái hoặc phụ huynh của nhà nước để điều chỉnh giao diện người dùng yếu tố (làm nổi bật sự chuyển hướng của nhà nước hiện hành) trong các mẫu của bạn thông qua $statecung cấp bởi ui-router mà bạn có thể phơi bày qua đặt nó ở $rootScopetrên run.

Về bản chất, ui-router là ngRouter với nhiều tính năng hơn, dưới các trang tính thì nó khá khác biệt. Những tính năng bổ sung này rất hữu ích cho các ứng dụng lớn hơn.

Thêm thông tin:

• Github: https://github.com/angular-ui/ui-router
• Tài liệu:
  • Tham khảo API: http://angular-ui.github.io/ui-router/site/#/api
  • Hướng dẫn: https://github.com/angular-ui/ui-router/wiki
• Câu hỏi thường gặp: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions
• Ứng dụng mẫu: http://angular-ui.github.io/ui-router/sample/#/

ngRoute là một mô-đun được phát triển bởi nhóm AngularJS, phần trước đó của lõi AngularJS.

ui-router là một khung được tạo bên ngoài dự án AngularJS để cải thiện và tăng cường khả năng định tuyến.

Từ tài liệu ui-router :

AngularUI Router là một khung định tuyến cho AngularJS, cho phép bạn sắp xếp các phần của giao diện vào một máy trạng thái. Không giống như dịch vụ $ route trong lõi Angular, được tổ chức xung quanh các tuyến URL, UI-Router được tổ chức xung quanh các trạng thái, có thể tùy chọn có các tuyến, cũng như các hành vi khác, được đính kèm.

Các trạng thái bị ràng buộc với các khung nhìn được đặt tên, lồng nhau và song song, cho phép bạn quản lý mạnh mẽ giao diện của ứng dụng.

Không phải trong số họ là tốt hơn, bạn sẽ phải chọn phù hợp nhất cho dự án của bạn.

Tuy nhiên, nếu bạn có kế hoạch để có các chế độ xem phức tạp trong ứng dụng của mình và bạn muốn giải quyết khái niệm "$ state". Tôi khuyên bạn nên chọn ui-router.

ngRoute là một mô-đun lõi góc tốt cho các kịch bản cơ bản. Tôi tin rằng họ sẽ thêm các tính năng mạnh mẽ hơn trong các phiên bản sắp tới.

URL: https://docs.angularjs.org/api/ngRoute

Ui-router là một mô-đun đóng góp khắc phục các vấn đề của ngRoute. Chủ yếu là lồng nhau / quan điểm phức tạp.

URL: https://github.com/angular-ui/ui-router

Một số khác biệt giữa ui-router và ngRoute

http://www.amasik.com/angularjs-ngroute-vs-ui-router/

ngRoute là một phần của khung AngularJS cốt lõi.

ui-router là một thư viện cộng đồng đã được tạo để cố gắng cải thiện các khả năng định tuyến mặc định.

Đây là một bài viết hay về cấu hình / thiết lập ui-router:

http://www.ng-newsletter.com/posts/angular-ui-router.html

Nếu bạn muốn sử dụng chức năng chế độ xem lồng nhau được triển khai trong mô hình ngRoute, hãy thử phân đoạn góc-tuyến - nó nhằm mục đích mở rộng ngRoute thay vì thay thế nó.

Nói chung ui-router hoạt động trên một cơ chế trạng thái ... Nó có thể được hiểu với một ví dụ dễ dàng:

Giả sử chúng ta có một ứng dụng lớn của thư viện nhạc (như ..gaana hoặc saavan hoặc bất kỳ ứng dụng nào khác). Và ở dưới cùng của trang, bạn có một trình phát nhạc được chia sẻ trên tất cả trạng thái của trang.

Bây giờ hãy nói rằng bạn chỉ cần nhấp vào một số bài hát để chơi. Trong trường hợp này, chỉ trạng thái trình phát nhạc đó nên thay đổi thay vì tải lại toàn bộ trang. Điều đó có thể dễ dàng xử lý bởi ui-router.

Trong khi ở ngRoute, chúng tôi chỉ đính kèm khung nhìn và bộ điều khiển.

Góc 1.x

tuyến đường :

ng-route được phát triển bởi angularJS Team để định tuyến.

ng-route: định tuyến dựa trên url (Vị trí).

Ví dụ:

$routeProvider
    .when("/home", {
        templateUrl : "home.html"
    })

tuyến đường :

ui-router được mô-đun bên thứ 3 phát triển.

ui-router: định tuyến dựa trên trạng thái

Ví dụ:

 $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'home.html'
        })

-> ui-router cho phép các khung nhìn lồng nhau

-> ui-router mạnh hơn ng-route

ng-router , ui-router

ngRoute là một mô-đun được xây dựng bởi nhóm Angular cung cấp chức năng định tuyến phía máy khách cơ bản. Mô-đun này cung cấp một cơ sở khá mạnh mẽ để định tuyến và có thể được xây dựng khá dễ dàng để cung cấp chức năng định tuyến vững chắc, như được minh họa trong bài đăng trên blog này (hãy chắc chắn đọc đoạn bình luận giữa Ward Bell và Ben Nadel, tác giả - chúng là một cặp đôi góc cạnh)

ui-router chuyển trọng tâm từ các tuyến đường trung tâm url sang "trạng thái" của ứng dụng, có thể hoặc không thể được phản ánh trong url.

Các tính năng chính được thêm bởi ui-router là các trạng thái lồng nhau và các khung nhìn được đặt tên.

Các trạng thái lồng nhau cho phép bạn tách logic điều khiển cho các phần khác nhau của ứng dụng. Một ví dụ rất đơn giản về điều này sẽ là một ứng dụng có điều hướng chính trên đầu trang, danh sách điều hướng phụ dọc bên trái và nội dung bên phải. Nếu không có các trạng thái lồng nhau, một bộ điều khiển duy nhất thường phải xử lý logic hiển thị cho điều hướng phụ cũng như nội dung. Định tuyến lồng nhau cho phép bạn tách những mối quan tâm này.

Chế độ xem được đặt tên là một tính năng bổ sung khác của ui-router. Với ngRoute, bạn chỉ có thể có một lệnh ngView duy nhất trên một trang, trong khi với các chế độ xem được đặt tên trong ui-router, bạn có thể chỉ định nhiều chỉ thị ui-view, sau đó mỗi trạng thái có thể ảnh hưởng đến mẫu và trình điều khiển của các chế độ xem tên. Một ví dụ siêu đơn giản về điều này sẽ là để nội dung chính của ứng dụng của bạn là chế độ xem chính và sau đó cũng có một thanh chân trang sẽ là một chế độ xem riêng. Trong trường hợp này, bộ điều khiển chân không còn phải lắng nghe thay đổi trạng thái / tuyến đường.

Một so sánh tốt của ngRoute và ui-router có thể được tìm thấy trên tập podcast này.

Để làm cho mọi thứ trở nên khó hiểu hơn, hãy để mắt đến mô-đun định tuyến "chính thức" mới mà nhóm Angular dự kiến ​​sẽ phát hành cho phiên bản 1.5 và 2.0 của Angular. Điều này sẽ được thay thế mô-đun ngRoute. Dưới đây là tài liệu hiện tại cho mô-đun Bộ định tuyến mới - nó khá thưa thớt kể từ bài đăng này vì việc triển khai chưa được hoàn thiện. Xem ở đây để biết thêm tin tức khi mô-đun này thực sự sẽ được phát hành.

ngRoute là một thư viện định tuyến cơ bản, nơi bạn có thể chỉ định một chế độ xem và bộ điều khiển cho bất kỳ tuyến đường nào.

Với ui-router, bạn có thể chỉ định nhiều chế độ xem, cả song song và lồng nhau. Vì vậy, nếu ứng dụng của bạn yêu cầu (hoặc có thể yêu cầu trong tương lai) bất kỳ loại định tuyến / chế độ xem phức tạp nào, thì hãy tiếp tục với ui-router.

Đây là hướng dẫn bắt đầu tốt nhất cho Bộ định tuyến AngularUI.

Điều cơ bản bạn phải biết: sử dụng ng-router $location.path()và sử dụng ui-router$state.go

Nghỉ ngơi cho chúng tôi tất cả các tính năng.

bộ định tuyến ui làm cho cuộc sống của bạn dễ dàng hơn! Bạn có thể thêm nó vào ứng dụng AngularJS bằng cách đưa nó vào ứng dụng của bạn ...

ng-route là một phần của AngularJS cốt lõi, vì vậy nó đơn giản hơn và cung cấp cho bạn ít tùy chọn hơn ...

Nhìn vào đây để hiểu rõ hơn về tuyến đường: https://docs.angularjs.org/api/ngRoute

Ngoài ra khi sử dụng, đừng quên sử dụng: ngView ..

ng-ui-router thì khác nhưng:

https://github.com/angular-ui/ui-router nhưng cung cấp cho bạn nhiều tùy chọn hơn ....

AngularUI Router là một khung định tuyến cho AngularJS, cho phép bạn sắp xếp các phần của giao diện vào một máy trạng thái. Không giống như dịch vụ $ route trong mô-đun Angular ngRoute, được tổ chức xung quanh các tuyến URL, UI-Router được tổ chức xung quanh các trạng thái, có thể tùy chọn có các tuyến, cũng như các hành vi khác, được đính kèm.

https://github.com/angular-ui/ui-router

ngRoute là một mô-đun được phát triển bởi nhóm Angular.js, phần trước đó của lõi Angular.

ui-router là một khung được tạo bên ngoài dự án Angular.js để cải thiện và tăng cường khả năng định tuyến.

1- ngRoute được phát triển bởi nhóm góc trong khi ui-router là mô-đun của bên thứ 3. 2- ngRoute thực hiện định tuyến dựa trên URL tuyến trong khi ui-router thực hiện định tuyến dựa trên trạng thái của ứng dụng. 3- ui-router cung cấp mọi thứ mà tuyến ng cung cấp cùng với một số tính năng bổ sung như trạng thái lồng nhau và nhiều chế độ xem được đặt tên.

ng-View(được phát triển bởi nhóm AngularJS) chỉ có thể được sử dụng một lần trên mỗi trang, trong khi ui-View(mô-đun bên thứ 3) có thể được sử dụng nhiều lần trên mỗi trang.

ui-View do đó là lựa chọn tốt nhất.