使用angularjs更新视图

时间:2015-04-06 20:33:22

标签: angularjs angularjs-directive angularjs-scope

我正在尝试创建一个示例应用程序,它使用morrischart通过3个按钮呈现图表上的一些数据。单击每个按钮时,应使用新的图形集重新呈现图表区域。以下是html的代码

这是代码

<div class="panel-body">
<linechart id="line-example" data-options="chart_options"></linechart>
</div>
<div class="panel-footer clearfix">
<a href="#"  class="btn btn-primary btn-lg" ng-click="data('usage')" data="usage">
<i class="fa fa-tachometer fa-fw" ></i>Usage</a>
                                    <a href="#"  class="btn btn-primary btn-lg" ng-click="data('cost')" data="cost">
<i class="fa fa-money fa-fw" ></i>Cost
</a>
<a href="#" class="btn btn-primary btn-lg" ng-click="data('weather')" data="weather">
<i class="fa fa-soundcloud fa-fw" ></i>Weather</a>
 </div>

获取数据并填入$ scope.chart_options变量的Javascript代码,该变量用于html代码的“linechart”元素。

====的JavaScript

$scope.data = function(reporttype){
            console.log(reporttype);
            var data=customersFactory.getChartData(reporttype);
             $scope.chart_options = data;
        };
//initialize chart
data('usage');

它初始化很好但是当我点击按钮更新图表时它正确地调用数据方法但是立即再次调用数据('usage')并覆盖值。我假设应该有一种方法只在初始化时调用方法,这样我就可以跳过两次调用数据方法。

由于 预先

1 个答案:

答案 0 :(得分:0)

我发现问题是由于我的控制器在UI中使用ng-init初始化,并且js文件中的重载方法也在初始化。从UI中删除后,它按预期工作。