Baca ini hanya jika Anda menetapkan tooltips secara dinamis
yaitu <div tooltip={{ obj.somePropertyThatMayChange }} ...></div>
Saya memiliki masalah dengan tooltips dinamis yang tidak selalu diperbarui dengan tampilan. Misalnya, saya melakukan sesuatu seperti ini:
Ini tidak berhasil secara konsisten
<div ng-repeat="person in people">
<span data-toggle="tooltip" data-placement="top" title="{{ person.tooltip }}">
{{ person.name }}
</span>
</div>
Dan mengaktifkannya sebagai:
$timeout(function() {
$(document).tooltip({ selector: '[data-toggle="tooltip"]'});
}, 1500)
Namun, karena array orang saya akan mengubah tooltips saya tidak selalu diperbarui. Saya mencoba setiap perbaikan di utas ini dan yang lainnya tidak berhasil. Glitch tampaknya hanya terjadi sekitar 5% dari waktu, dan hampir tidak mungkin terulang.
Sayangnya, keterangan alat ini sangat penting untuk proyek saya, dan menunjukkan keterangan alat yang salah bisa sangat buruk.
Apa yang tampaknya menjadi masalahnya
Bootstrap menyalin nilai titleproperti ke atribut baru, data-original-titledan menghapus titleproperti (kadang-kadang) ketika saya akan mengaktifkan toooltips. Akan tetapi, bila saya title={{ person.tooltip }}mau merubah nilai baru tidak akan selalu dimutakhirkan menjadi property data-original-title. Saya mencoba menonaktifkan tooltips dan mengaktifkannya kembali, menghancurkannya, mengikat properti ini secara langsung ... semuanya. Namun masing-masing tidak berhasil atau menimbulkan masalah baru; seperti atribut titledan data-original-titlekeduanya dihapus dan dilepas dari objek saya.
Apa yang berhasil
Mungkin kode paling jelek yang pernah saya dorong, tetapi itu memecahkan masalah kecil tapi substansial ini bagi saya. Saya menjalankan kode ini setiap kali tooltip diperbarui dengan data baru:
$timeout(function() {
$('[data-toggle="tooltip"]').each(function(index) {
if ($(this).attr("title").length > 0) {
$( this ).attr("data-original-title", $(this).attr("title"));
}
});
$timeout(function() {
$(document).tooltip({ selector: '[data-toggle="tooltip"]'});
}, 500);
}, 1500);
Apa yang terjadi di sini pada dasarnya adalah:
- Tunggu beberapa saat (1500 ms) hingga siklus intisari selesai, dan
titles akan diperbarui.
- Jika ada
titleproperti yang tidak kosong (yaitu telah berubah), salin ke data-original-titleproperti tersebut agar dapat diambil oleh toolips Bootstrap.
- Aktifkan kembali keterangan alat
Semoga jawaban panjang ini membantu seseorang yang mungkin berjuang seperti saya.