Apa perbedaan antara angular-route dan angular-ui-router?

Saya berencana menggunakan AngularJS dalam aplikasi besar saya. Jadi saya sedang dalam proses untuk mencari tahu modul yang tepat untuk digunakan.

Apa perbedaan antara modul ngRoute (angular-route.js) dan ui-router (angular-ui-router.js) ?

Dalam banyak artikel ketika ngRoute digunakan, rute dikonfigurasikan dengan $ routeProvider . Namun, ketika digunakan dengan ui-router , rute dikonfigurasikan dengan $ stateProvider dan $ urlRouterProvider .

Modul mana yang harus saya gunakan untuk pengelolaan yang lebih baik dan ekstensibilitas?

ui-router adalah modul pihak ke-3 dan sangat kuat. Ini mendukung semua hal yang bisa dilakukan ngRoute normal serta banyak fungsi tambahan.

Berikut adalah beberapa alasan umum ui-router dipilih daripada ngRoute:

• ui-router memungkinkan untuk tampilan bersarang dan beberapa tampilan bernama . Ini sangat berguna dengan aplikasi yang lebih besar di mana Anda mungkin memiliki halaman yang mewarisi dari bagian lain.

• ui-router memungkinkan Anda untuk menghubungkan tipe-kuat antar negara berdasarkan nama negara. Mengubah url di satu tempat akan memperbarui setiap tautan ke keadaan itu saat Anda membangun tautan dengan ui-sref. Sangat berguna untuk proyek yang lebih besar di mana URL dapat berubah.

• Ada juga konsep dekorator yang dapat digunakan untuk memungkinkan rute Anda dibuat secara dinamis berdasarkan URL yang mencoba diakses. Ini bisa berarti bahwa Anda tidak perlu menentukan semua rute Anda sebelumnya.

• negara memungkinkan Anda untuk memetakan dan mengakses informasi yang berbeda tentang negara yang berbeda dan Anda dapat dengan mudah menyampaikan informasi antar negara melalui $stateParams.

• Anda dapat dengan mudah menentukan apakah Anda berada dalam keadaan atau orang tua dari suatu negara untuk menyesuaikan elemen UI (menyoroti navigasi dari kondisi saat ini) di dalam template Anda melalui yang $statedisediakan oleh ui-router yang dapat Anda paparkan melalui pengaturannya $rootScopeaktif run.

Intinya, ui-router adalah ngRouter dengan lebih banyak fitur, di bawah lembaran itu sangat berbeda. Fitur tambahan ini sangat berguna untuk aplikasi yang lebih besar.

Informasi Lebih Lanjut:

• Github: https://github.com/angular-ui/ui-router
• Dokumentasi:
  • Referensi API: http://angular-ui.github.io/ui-router/site/#/api
  • Panduan: https://github.com/angular-ui/ui-router/wiki
• Tanya Jawab: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions
• Contoh Aplikasi: http://angular-ui.github.io/ui-router/sample/#/

ngRoute adalah modul yang dikembangkan oleh tim AngularJS yang sebelumnya merupakan bagian dari inti AngularJS.

ui-router adalah kerangka kerja yang dibuat di luar proyek AngularJS untuk meningkatkan dan meningkatkan kemampuan routing.

Dari dokumentasi ui-router :

Router AngularUI adalah kerangka kerja perutean untuk AngularJS, yang memungkinkan Anda untuk mengatur bagian-bagian antarmuka Anda menjadi mesin negara. Tidak seperti layanan $ route di Angular core, yang diorganisasikan di sekitar rute URL, UI-Router diorganisasikan di sekitar state, yang secara opsional memiliki rute, serta perilaku lainnya, yang dilampirkan.

Status terikat pada tampilan yang dinamai, bersarang, dan paralel, memungkinkan Anda mengelola antarmuka aplikasi dengan kuat.

Tak satu pun dari mereka yang lebih baik, Anda harus memilih yang paling tepat untuk proyek Anda.

Namun, jika Anda berencana untuk memiliki tampilan kompleks dalam aplikasi Anda dan Anda ingin berurusan dengan gagasan "$ state". Saya sarankan Anda untuk memilih ui-router.

ngRoute adalah modul inti sudut yang bagus untuk skenario dasar. Saya percaya mereka akan menambah fitur yang lebih kuat di rilis mendatang.

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

Ui-router adalah modul kontribusi yang mengatasi masalah ngRoute. Terutama tampilan Bersarang / Kompleks.

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

Beberapa perbedaan antara ui-router dan ngRoute

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

ngRoute adalah bagian dari kerangka kerja inti AngularJS.

ui-router adalah perpustakaan komunitas yang telah dibuat untuk berupaya meningkatkan kemampuan perutean default.

Berikut ini adalah artikel bagus tentang konfigurasi / pengaturan ui-router:

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

Jika Anda ingin memanfaatkan fungsionalitas tampilan bersarang yang diterapkan dalam paradigma ngRoute, coba segmen sudut-rute - ini bertujuan untuk memperluas ngRoute daripada menggantikannya.

Umumnya ui-router bekerja dengan mekanisme state ... Dapat dimengerti dengan contoh mudah:

Katakanlah kita memiliki aplikasi besar perpustakaan musik (seperti ..gaana atau saavan atau lainnya). Dan di bagian bawah halaman, Anda memiliki pemutar musik yang dibagikan di semua keadaan halaman.

Sekarang katakanlah Anda cukup mengeklik beberapa lagu untuk diputar. Dalam hal ini, hanya keadaan pemutar musik yang harus diubah alih-alih memuat ulang seluruh halaman. Itu dapat dengan mudah ditangani oleh ui-router.

Sementara di ngRoute kita cukup melampirkan view dan controller.

1.x sudut

ng-rute :

ng-route dikembangkan oleh Tim angularJS untuk routing.

ng-rute: routing berbasis url (Lokasi).

Ex:

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

rute ui :

ui-router di-develoepd oleh modul pihak ke-3.

ui-router: routing berbasis negara

Ex:

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

-> ui-router memungkinkan untuk tampilan bersarang

-> ui-router lebih kuat dari ng-route

ng-router , ui-router

ngRoute adalah modul yang dibangun oleh tim Angular yang menyediakan fungsionalitas perutean sisi klien dasar. Modul ini memberikan dasar yang cukup kuat untuk perutean, dan dapat dibangun dengan cukup mudah untuk memberikan fungsionalitas perutean yang solid, sebagaimana dicontohkan dalam posting blog ini (pastikan untuk membaca jejak komentar antara Ward Bell dan Ben Nadel, penulis - mereka adalah beberapa pro Angular)

ui-router mengalihkan fokus dari rute url-centric ke "status" aplikasi, yang mungkin tercermin di url.

Fitur utama yang ditambahkan oleh ui-router adalah status bersarang dan tampilan bernama.

Status bersarang memungkinkan Anda memisahkan logika pengontrol untuk berbagai bagian aplikasi. Contoh yang sangat sederhana dari ini adalah aplikasi dengan navigasi utama di bagian atas, daftar navigasi sekunder di sebelah kiri, dan konten di sebelah kanan. Tanpa status bersarang, pengontrol tunggal biasanya harus menangani logika tampilan untuk navigasi sekunder serta konten. Perutean bersarang memungkinkan Anda untuk memisahkan masalah ini.

Tampilan bernama adalah fitur tambahan lain dari ui-router. Dengan ngRoute, Anda hanya dapat memiliki satu direktif ngView pada satu halaman, sedangkan dengan tampilan bernama di ui-router Anda dapat menentukan beberapa arahan view-ui, dan kemudian setiap negara bagian dapat memengaruhi templat dan pengontrol tampilan nama. Contoh super sederhana dari ini adalah memiliki konten utama aplikasi Anda menjadi tampilan utama, dan kemudian juga memiliki bar footer yang akan menjadi tampilan ui-terpisah. Dalam skenario ini, pengendali footer tidak lagi harus mendengarkan perubahan status / rute.

Perbandingan ngRoute dan ui-router yang bagus dapat ditemukan di episode podcast ini .

Agar lebih membingungkan, awasi modul perutean "resmi" baru yang diharapkan akan dirilis oleh tim Angular untuk versi 1.5 dan 2.0 Angular. Ini akan menggantikan modul ngRoute. Berikut ini adalah dokumentasi saat ini untuk modul Router baru - ini cukup jarang pada posting ini karena implementasi belum diselesaikan. Tonton di sini untuk berita lebih lanjut tentang kapan modul ini sebenarnya akan dirilis.

ngRoute adalah pustaka perutean dasar, di mana Anda dapat menentukan hanya satu tampilan dan pengontrol untuk rute apa pun.

Dengan ui-router, Anda dapat menentukan banyak tampilan, baik yang paralel maupun bersarang. Jadi jika aplikasi Anda membutuhkan (atau mungkin memerlukan di masa depan) segala jenis perutean / tampilan yang kompleks, maka lanjutkan dengan ui-router.

Ini panduan memulai terbaik untuk Router AngularUI.

Hal dasar yang harus Anda ketahui: penggunaan ng-router $location.path()dan penggunaan ui-router$state.go

Istirahatkan kami semua fitur.

router ui membuat hidup Anda lebih mudah! Anda dapat menambahkannya ke aplikasi AngularJS Anda melalui menyuntikkannya ke aplikasi Anda ...

ng-route hadir sebagai bagian dari AngularJS inti, jadi lebih sederhana dan memberi Anda lebih sedikit opsi ...

Lihat di sini untuk memahami ng-rute yang lebih baik: https://docs.angularjs.org/api/ngRoute

Juga saat menggunakannya, jangan lupa untuk menggunakan: ngView ..

ng-ui-router berbeda tetapi:

https://github.com/angular-ui/ui-router tetapi memberi Anda lebih banyak pilihan ....

Router AngularUI adalah kerangka kerja perutean untuk AngularJS, yang memungkinkan Anda untuk mengatur bagian-bagian antarmuka Anda menjadi mesin negara. Tidak seperti layanan $ route dalam modul Angular ngRoute, yang diorganisasikan di sekitar rute URL, UI-Router diorganisasikan di sekitar negara, yang secara opsional memiliki rute, serta perilaku lainnya, yang dilampirkan.

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

ngRoute adalah modul yang dikembangkan oleh tim Angular.js yang sebelumnya merupakan bagian dari inti Angular.

ui-router adalah kerangka kerja yang dibuat di luar proyek Angular.js untuk meningkatkan dan meningkatkan kemampuan routing.

1- ngRoute dikembangkan oleh tim sudut sedangkan ui-router adalah modul pihak ke-3. 2- ngRoute mengimplementasikan perutean berdasarkan URL rute sedangkan ui-router mengimplementasikan perutean berdasarkan keadaan aplikasi. 3- ui-router menyediakan segala yang disediakan rute-n plus beberapa fitur tambahan seperti status bersarang dan beberapa tampilan bernama.

ng-View(dikembangkan oleh tim AngularJS) dapat digunakan hanya sekali per halaman, sedangkan ui-View(modul pihak ke-3) dapat digunakan beberapa kali per halaman.

ui-View Oleh karena itu pilihan terbaik.