Angular.js: ngMessagesInclude diproses setelah ngMessages induk dihapus dari DOM

Seperti judulnya, ngMessagesInclude diproses setelah ngMessages induk dihapus dari DOM. Gagal karena angular tidak dapat menemukan pengontrol induk untuk menautkan pesan dalam. Itu tidak terjadi ketika ngMessage 's inline di dalam elemen ngMessages , atau saat elemen induk masih ada di DOM.

Memiliki ng-pesan seperti ini:

<div ng-if="myForm.$submitted" ng-messages="myForm.myName.$error">
  <div ng-messages-include="messages.html"></div>
</div>

Pengajuan dipicu oleh:

this.change = function(myForm) {
  var self = this;
  myForm.$setSubmitted();    // event A
  $scope.$applyAsync(function () {
    self.currentStep = 'step2.html';     // event B
  });
};

Pada acara (A), messages.html diunduh. Karena menggunakan $templateRequest , penautan terhenti hingga server kembali. Sementara itu, event (B) dilanjutkan dengan penghapusan ngMessages dan turunannya dari DOM. Nanti, konten ngMessagesInclude tiba dan angular akan mengompilasinya. Tetapi pada saat itu tidak ada cara untuk mengambil pengontrol ngMessages lagi.

Plnkr: http://plnkr.co/edit/0GOOLERvfj7n9vDVEyZp?p=preview

Sebagian besar waktu, itu akan terjadi bersama dengan kondisi ngIf .

Diuji terhadap versi 1.4.4.

Saya telah menemukan cara untuk menghindarinya:

ng-if="myForm.$submitted && myForm.myName.$invalid" 

Untuk mengatasinya di sisi komponen, require: '^^ngMessages' dapat dibuat opsional dan memeriksa kondisi itu selama penautan.