图表.js在进行更新调用后不会更新



我有一个小的angular应用程序,它根据asp中的下拉列表中的月份/年份进行api调用。这意味着每当年或月的下拉列表发生变化时,都会调用api。

第一个/原始负载运行良好。根据任何更改的调试器,我会在更改时调用api,并得到返回。整个";卡片小部件"/ChartControllerdiv正在消失(即使css属性被注释掉(。

我的ASP代码:

<div id="card">
<div>

</div>
<div id="card-widget" ng-app="ChartApp" ng-controller="ChartController" style="width:350px; height: 350px;">  
<div>
<asp:DropDownList ID="lstMonth" runat="server" ng-model="month" ng-change="updateChart()"></asp:DropDownList>
<asp:DropDownList ID="lstYear" runat="server" ng-model="year" ng-change="updateChart()"></asp:DropDownList>
</div>
<div>
<canvas id="Chart" height="350" width="350"></canvas>  
</div>
</div> 
<div id="card-widget-fail" style="width: 350px; height: 100px;">
<label>No chart</label>
</div>
</div>

我的角度代码:

var app = angular.module("ChartApp", []);
app.controller('ChartController', function ($scope, $http) {
$scope.updateChart = function () { getChart() };
var dataChart = document.getElementById("Chart").getContext('2d');
var year = document.getElementById("<%=lstYear.ClientID %>");
var month = document.getElementById("<%=lstMonth.ClientID %>");
getChart();
function getChart() {
//api call to load chart data based off month.options[year.selectedIndex].text & year.options[year.selectedIndex].text
}
});

没有调用getChart()的原因是因为它不存在于$scope元素上。请改用$scope.getChart = function() { ... }。我建议阅读本文档页,特别是";范围作为数据模型";。

最新更新