Question

我有一个angularjs项目，我正在使用angular-ui（bootstrap）标签。我的问题是我正在使用图表工具。

有没有办法检测到标签已经完全加载。

<tabset justified="false">
    <tab heading="Yesterday"  ng-controller="yesterdayCtrl" ng-cloak >
        <div ng-include="'templates/tabViews/yesterday.html'" scope="" onload="" ></div>
    </tab>
    <tab heading="Weekly" ng-controller="weeklyCtrl" >
        <div ng-include="'templates/tabViews/weekly.html'" scope="" onload="" ></div>
    </tab>
    <tab heading="Monthly"></tab>
    <tab heading="Yearly"></tab>
</tabset>

每个ng-include都包含详细信息选项卡，其中包含大量图表。问题是，单击ta并查看时，图表不会显示。我必须重新调用所有重绘功能。我看到这是因为图表是在后台绘制的。

我正在使用c3.js和d3.js

DrawService.drawSpline =  function(ele,data) {
    c3.generate({
        bindto: '#'+ele,
        data: data
    });
}

Answer 1

临时修复

<tabset justified="false">
<tab heading="Yesterday"  ng-controller="yesterdayCtrl" ng-click="loadYes()">
<div ng-include="'templates/tabViews/yesterday.html'" scope="" onload="loadYes()" ng-cloak ></div>
</tab>
<tab heading="Weekly" ng-controller="weeklyCtrl" ng-click="loadWeek()">
<div ng-include="'templates/tabViews/weekly.html'" scope=""  ng-cloak></div>
</tab>
<tab heading="Monthly" ng-controller="monthlyCtrl" ng-click="loadMonth()">
<div ng-include="'templates/tabViews/monthly.html'" scope="" n ng-cloak></div>

</tab>
<tab heading="Yearly" ng-controller="yearlyCtrl" ng-click="loadYear()">
    <div ng-include="'templates/tabViews/yearly.html'" scope=""  ng-cloak></div>


</tab>

</tabset>

在Angularjs中通过控制器检测元件负载

1 个答案: