Apa keuntungan yang ada dalam menggunakan $timeout di AngularJS sebagai pengganti jendela.setTimeout?

Saya punya saran untuk menerapkan batas waktu seperti ini:

  $timeout(function() {

    // Loadind done here - Show message for 3 more seconds.
    $timeout(function() {
      $scope.showMessage = false;
    }, 3000);

  }, 2000);
};

Dapatkah seseorang mengatakan padaku apa alasannya / keuntungan dalam menggunakan ini daripada menggunakan setTimeout?

Larutan

Dalam kata dasar $timeout mengacu pada angularjs ketika setTimeout - untuk JavaScript.

Jika anda masih berpikir untuk menggunakan setTimeout oleh karena itu anda perlu memanggil $scope.$berlaku() setelah

Sebagai catatan

Saya sarankan anda untuk membaca Bagaimana cara "berpikir di AngularJS" jika saya memiliki jQuery latar belakang? post

dan AngularJS: menggunakan $timeout, tidak setTimeout

Contoh 1: $timeout

   $scope.timeInMs = 0;

    var countUp = function() {
        $scope.timeInMs+= 500;
        $timeout(countUp, 500);
    }    
    $timeout(countUp, 500); 

Contoh 2: setTimeout (logika yang sama)

 $scope.timeInMs_old = 0;

    var countUp_old = function() {
        $scope.timeInMs_old+= 500;        
        setTimeout(function () {
        $scope.$apply(countUp_old);
    }, 500);
    }

    setTimeout(function () {
        $scope.$apply(countUp_old);
    }, 500);

Demo [Biola][3]


$timeout juga kembali janji

JS

function promiseCtrl($scope, $timeout) { 
 $scope.result = $timeout(function({ 
 return "Ready!"; 
 }, 1000); 
}

HTML

<div ng-controller="promiseCtrl"> 
 {{result || "Preparing…"}}
</div> 

$timeout juga memicu mencerna siklus

Anggap kita memiliki beberapa 3d partai kode (tidak AngularJS) seperti Cloudinary plugin yang upload beberapa file dan mengembalikan kita 'kemajuan' persentase tingkat callback.

     // .....
     .on("cloudinaryprogress",
           function (e, data) {
               var name = data.files[0].name;
               var file_ = $scope.file || {};
               file_.progress = Math.round((data.loaded * 100.0) / data.total);

                $timeout(function(){
                     $scope.file = file_;
                }, 0);         
            })

Kami ingin memperbarui UI alias $scope.file = file_;

Jadi kosong $timeout melakukan pekerjaan untuk kami, itu akan memicu siklus mencerna dan $scope.file diperbarui oleh pihak 3d akan kembali diberikan dalam GUI

Komentar (3)
  1. Itu membungkus anda callback untuk anda secara otomatis di blok coba/tangkap dan let's anda menangani kesalahan dalam $exceptionHandler layanan: http://docs.angularjs.org/api/ng.$exceptionHandler
  2. Kembali janji dan dengan demikian cenderung untuk beroperasi baik dengan janji-berdasarkan kode dari tradisional callback pendekatan. Ketika anda balik kembali, nilai yang dikembalikan adalah digunakan untuk diselesaikan janji.
Komentar (0)

AngularJS memodifikasi JavaScript normal aliran dengan menyediakan sendiri kegiatan pengolahan loop. Ini membagi JavaScript menjadi klasik dan AngularJS konteks eksekusi. Hanya operasi yang diterapkan di AngularJS konteks eksekusi akan mendapatkan keuntungan dari AngularJS data-binding, penanganan eksepsi, properti, menonton, dll.

Dengan menggunakan AngularJS $timeout layanan, dibungkus setTimeout akan dieksekusi di AngularJS konteks eksekusi.

Untuk informasi lebih lanjut, lihat

Komentar (0)