Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Mengelakkan Gelung Infinite Apabila Menambah Arahan dalam AngularJS?

Bagaimana untuk Mengelakkan Gelung Infinite Apabila Menambah Arahan dalam AngularJS?

Barbara Streisand
Lepaskan: 2024-11-06 03:09:02
asal
276 orang telah melayarinya

How to Avoid Infinite Loops When Adding Directives in AngularJS?

Mengatasi Gelung Infinite semasa Penambahan Arahan

Dalam AngularJS, anda boleh menghadapi isu gelung tak terhingga apabila cuba menambah arahan tambahan pada elemen dari dalam arahan. Ini berlaku disebabkan oleh proses penyusunan semula automatik AngularJS selepas perubahan arahan.

Untuk menangani isu ini, anda boleh memanfaatkan perkhidmatan $compile bersama-sama dengan manipulasi elemen untuk menambah arahan yang dikehendaki tanpa mencetuskan gelung tak terhingga. Berikut ialah versi ubah suai kod anda yang menyelesaikan masalah:

angular.module('app')
  .directive('superDirective', function ($compile, $injector) {
    return {
      restrict: 'A',
      replace: true,
      link: function compile(scope, element, attrs) {
        if (!element.attr('datepicker')) { // Check for existing attributes
          element.attr('datepicker', 'someValue');
          element.attr('datepicker-language', 'en');
          element.removeAttr("ng-required"); // Remove any ng-required attribute
          $compile(element)(scope); // Compile the updated element
        }
      }
    };
  });
Salin selepas log masuk

Pendekatan ini mengelakkan gelung tak terhingga dengan menyemak arahan sedia ada sebelum menambahkannya. Selain itu, ia mengalih keluar sebarang atribut ng-diperlukan sedia ada untuk menghalang berbilang contoh arahan daripada menetapkannya. Dengan menggunakan strategi ini, anda boleh menambah arahan kepada elemen dari dalam arahan induk dengan selamat.

Jika anda menemui berbilang kompilasi arahan anda pada satu elemen (seperti dalam elemen