Я пытаюсь показать содержимое <div id="right">
когда мышь зависает на другом div. #right
содержит график из Angular-Chart (http://jtblin.github.io/angular-chart.js/).
Вот мой jQuery:
<div>
<div>
<canvas id="doughnut" class="chart chart-doughnut" data="data" labels="labels" legend="true" click="onClick">
</canvas>
</div>
<h3>Some text</h3>
</div>
Я попытался реализовать это, чтобы показать в #right, когда он зависает над моим другим div в моем jQuery.
$(function(){
$('#some_other_div').on('mouseover', function(){
$('#right').html('<div><canvas id="doughnut" class="chart chart-doughnut" data="data" labels="labels" legend="true" click="onClick"></canvas></div><h3>Some text</h3>');
})
});
При some_other_div
на some_other_div
, только пустое место и Some text
отображаются внизу. Я убедился, что график работает в другом месте при его реализации непосредственно в HTML. Только перед этой проблемой через.html.
Есть ли способ исправить это? Спасибо.
Изменение html вне системы Angular не говорит Angular, что DOM изменен, чтобы он действовал. Попробуйте выполнить изменение с помощью функции $ apply().
angular.element("#some_other_div").scope().$apply($('#right').html('<div><canvas id="doughnut" class="chart chart-doughnut" data="data" labels="labels" legend="true" click="onClick"></canvas></div><h3>Some text</h3>');)