Angular.js: Mendukung modul asinkron.run()

Ini tidak begitu mudah tetapi harus diperhatikan.

Cara Jasmine melakukan ini adalah dengan menyetel flag, yang akan membiarkan fungsi berjalan dan menunggu panggilan balik hingga flag disetel ke true , atau hingga timeout diaktifkan.

Pada dasarnya sesuatu seperti ini:

var flag = false;
$http(...).success(flag = true);
$timeout(function () {
    flag = true;
    // Or add some error handling stuff here
}, 5000);
while (!flag) {};

Itu tidak cantik, tetapi harus melakukan pekerjaan itu. Kode di atas belum diuji, jadi Anda mungkin perlu sedikit memodifikasinya. Sudah larut di sini. Mudah-mudahan sesuatu untuk membantu Anda sampai sesuatu yang sedikit lebih cantik datang.

+1

Namun, sesaat, ini menyebabkan ketidakmampuan untuk menggambar layar pemuatan mewah menggunakan arahan sudut ...

+1

Bukankah $routeProvider dengan resolve menyelesaikan ini? Mungkin saya tidak mengerti masalahnya ...

Ini lebih untuk dukungan init modul async. Dengan itu, saya tidak lagi membutuhkan ini dalam proyek saya saat ini.

@shahata $routeprovider melakukan ini, tetapi tidak setiap kasus penggunaan untuk pemberian janji run s menggunakan rute. Dalam kasus penggunaan saya, ini untuk modul yang membungkus arahan dan tidak ada hubungannya dengan rute.

+1

periksa apakah fungsi run mengembalikan janji, lalu lanjutkan hanya saat diselesaikan. karena runBlocks adalah array fungsi, seharusnya tidak sulit sama sekali

+1

+1 memalukan bahwa ini diabaikan

ada ide kapan ini akan mendarat? sangat frustasi harus memindahkan hal-hal inisialisasi untuk diselesaikan di router, terutama karena terkadang kode inisialisasi adalah agnostik url (alias, harus diinisialisasi untuk semua jenis URL yang pengguna tiba di SPA Anda)

saya tidak berpikir angular akan menerima peningkatan apa pun selanjutnya. mereka semua ditambahkan ke angular 2.0

berapa lama metode run setengah-setengah akan tetap sinkron? tidak masalah dan dapat dimengerti bahwa config tidak mendukung panggilan asinkron, karena Anda tidak memiliki penyedia yang melakukan panggilan $http , tetapi run melakukannya. lihat jenis peretasan yang disebabkan oleh kurangnya fitur ini (yang seharusnya sudah ada sejak awal)
https://github.com/philippd/angular-deferred-bootstrap/blob/master/src/deferred-bootstrap.js

itu memalukan

+1

@btford sedang melihat bagaimana kasus penggunaan di sekitar ini dapat didukung melalui router baru daripada di dalam blok yang dijalankan.

+1

+1

+1

+1

Masalah utama yang kami miliki adalah $q dibuat di dalam modul yang sedang dimuat ketika runBlocks sedang dijalankan. Ini berarti bahwa kita perlu mengekstrak "beberapa" layanan (atau mungkin modul) dan membuatnya terlebih dahulu dan kemudian memiliki pass kedua yang memuat sisa modul (dan layanan, menjalankan blok, dll) setelah $q memiliki telah dibuat.

@lgalfaso - mungkin Anda bisa melihat ini lebih jauh sebagai bagian dari pekerjaan $injector akhir minggu ini (atau berikutnya)?

Saya tahu ini hanya solusi, tetapi saya biasanya memecahkan masalah memiliki beberapa logika bootstrap async dengan menggunakan router ui sudut dan memiliki status abstrak root dalam kombinasi dengan tekad. Status abstrak root harus selalu diselesaikan terlebih dahulu, jadi ini adalah tempat yang baik untuk memuat pengaturan, menampilkan animasi pemuatan, dll.

Ini akan sangat bagus.
:+1:
Menunggu perbaikan ini. Semoga bisa masuk 1.4

+1

Saya mendapat kasus penggunaan lain: Saya perlu memulai titik akhir simulasi saya dengan panggilan $http saat startup (untuk men-cache beberapa data) ...

+1

+1

barusan juga ngalamin ini...

@petebacondarwin saya pikir tidak apa-apa untuk melanjutkan memuat semua modul lain, tetapi menunda memulai navigasi awal.

atau $routeProvider dapat menawarkan parameter fungsi yang dapat dikonfigurasi yang harus menunda rendering rute awal.

+1

+1

Berikut ini adalah solusi yang mungkin: http://plnkr.co/edit/vi7mDjmD4NpZAoP7MVzr?p=preview
Idenya adalah bahwa Angular benar-benar memberi Anda kemampuan untuk membuat injektor Anda sendiri dari satu set modul. Dalam hal ini, saya telah menunda kompilasi $rootElement hingga banyak janji ( resolves ) telah diselesaikan. Ini adalah POC dan akan ada sejumlah lonceng dan peluit lain yang diperlukan untuk membuat produksi ini siap. Terlepas dari hal lain, Anda perlu menangkap kesalahan dalam penyelesaian daripada hanya menelannya.

+1

Ini sebagian besar merupakan panduan bagi siapa pun yang ingin mencobanya; Saat ini proses bootstrap melakukan hal berikut:

• Pemeriksaan kesehatan
• Membuat produksi untuk $rootElement
• Membuat injektor
• Mengkompilasi dan menautkan $rootElement

Di atas, saat membuat injektor langkah-langkahnya adalah sebagai berikut:

• Melintasi pohon modul ketergantungan dan
  
  
  
  • Inisialisasi modul yang akan mendaftarkan konstanta modul, nilai, penyedia, dan hal lainnya
  
  
  • Menjalankan fungsi konfigurasi
  
  
  • Kumpulkan fungsi run untuk nanti
  
  
• Jalankan semua fungsi run

Ada beberapa poin penting:

• Semua blok run dieksekusi sebelum $rootElement dikompilasi
• Tidak ada siklus intisari dalam proses pembuatan injektor, siklus intisari pertama adalah selama kompilasi awal $rootElement
• $q menyelesaikan janji selama siklus intisari _only_

Ini adalah:

• Jika ada modul yang memiliki fungsi run yang mengembalikan janji dan janji harus diselesaikan sebelum aplikasi dimulai, maka akan ada siklus intisari sebelum kompilasi awal (ini dapat merusak aplikasi yang ada)
• Blok konfigurasi tidak dapat mengembalikan janji karena fungsi config disuntikkan dengan penyedia, bukan dengan instance

Solusi apa pun, perlu menangani kasus-kasus ini

+1
ada berita?
Saya hanya ingin memuat beberapa pengaturan konfigurasi sebelum aplikasi benar-benar dimulai.

+1

Saya akan memuat beberapa data async setelah bootstrap ketika semua pabrik saya aktif dan sebelum dikompilasi.

@dagingaa : Saya pikir saya akan memilih solusi Anda sebagai solusi! Terima kasih

• 1

Perbarui ke @dagingaa : for loop membekukan browser saya, tidak bagus ...

https://jsfiddle.net/tuxmachine/t4d63vnw/

Ini adalah bagaimana saya menyelesaikannya untuk implementasi token OAuth, yang membutuhkan panggilan ajax awal untuk diselesaikan sebelum menginisialisasi sisa aplikasi.

Tidak akan berfungsi jika Anda memiliki beberapa blok run asinkron

+1

+1

+1

Sudah dua tahun sejak masalah dibuka dan masih belum ada solusi yang baik

@vladmiller Ada solusi tetapi mungkin Anda tidak merasa itu bagus:

• gunakan ngRoute atau ui-router dengan resolusi dan letakkan kode startup aplikasi Anda di dalam rute tingkat atas
• buat bootstrap async Anda sendiri. lihat https://github.com/angular/angular.js/issues/4003#issuecomment -113842180
• gunakan router komponen baru dengan $onActivate di komponen tingkat atas

Menempatkan pekerjaan aplikasi non-sepele di dalam blok .run mempersulit pengujian unit kode Anda. Jadi itu bukan sesuatu yang ingin kami dorong. Memindahkan ini ke Kotak Es sebagai sesuatu yang kemungkinan besar tidak akan kami terapkan.

@petebacondarwin saya tidak setuju dengan Anda; semua orang mengharapkan angluar menjadi sederhana dan intuitif, sebagai gantinya Anda harus mengimplementasikan modul bootstrap async Anda sendiri atau modul bootstrap di tempat yang berbeda. Menurut pendapat saya ini membuat sudut lebih kompleks.

Bisakah Anda juga menjelaskan apa yang Anda maksud ketika mengatakan bahwa kode async di .run akan membuat pengujian lebih sulit?

Mohon maaf atas komentar kasar saya sebelumnya.
Terima kasih

@petebacondarwin Saya gagal melihat bagaimana itu membuatnya sulit untuk diuji. jika Anda menempatkan kode inisialisasi dalam suatu layanan, Anda bisa melihat/mengejek/membandingkan hasil yang Anda harapkan dari tiruan backend http, terlepas dari apakah itu dieksekusi di dalam blok .run atau tidak. memiliki kode yang ada di luar sudut karena penyelesaian karena kurangnya async run adalah yang membuatnya hampir tidak mungkin untuk diuji

Bagaimana hal itu terjadi?

Pendekatan lain: http://plnkr.co/edit/8XGSNOzzRGvgNSSnXx3M?p=preview

@petebacondarwin solusi bekerja untuk saya

Karena ada solusi dan mendukung async run block akan menambah kompleksitas bootstrap, saya rasa kami tidak akan mengimplementasikan fitur ini.

Fitur sederhana tetapi terlalu sulit untuk diterapkan. 😕

+1 untuk fitur ini

+1

+1

@petebacondarwin solusi bekerja dengan baik.

+1. :(

+1

+1

+1

+1

Kami tidak akan melakukan ini.

+100, semua pekerjaan di sekitarnya mengerikan.

@Eduardo-Julio - kami tidak akan mengimplementasikan fitur ini karena akan membuat bootstrap aplikasi AngularJS jauh lebih kompleks. Menambahkan lebih lanjut + s tidak akan membantu.