1

I need to find a better solution regarding ng-repeat, $scope variable and infinite $digest loop. I'm sure it's not $watch issue and I'm sure it's in the way I'm updating my $scope variable.

The issue doesn't happen in Chrome. It only happens in Safari and Firefox. This is how I'm doing it. I have a $scope.chartCollection which is dynamically populated with Google Chart objects. The $scope.chartCollection can have 1 or more google chart objects depending on my selection.

In my html template, I have this code,

<div ng-repeat="device in chartCollection">
    <div class="col-md-6  padding10px">
        <div class="widget enable-top-radius chartProperties">
            <div class="widget-title enable-top-radius dark-gray-title">
                <h4>
                    <span class="alignleft">
                        <i class="fa fa-circle" ng-style="{ color : device.dotColor }"></i><span class="padding5px">{{printerTypeName}}</span><span class="padding5px">|</span><span class="padding5px" popover="{{device.modelOrLocation }}" popover-trigger="mouseenter">{{ device.modelOrLocation }}</span>
                    </span>
                </h4>
                <span class="alignright">{{device.location | uppercase }}</span>
                <div style="clear: both;" class="padding5px"></div>
            </div>
            <div class="widget-body">
                <div google-chart chart="device.chart" on-select="seriesSelected(selectedItem, $index)"></div>
            </div>
        </div>
        <div class="col-md-12 col-sm-12 col-xs-12 no-padding chartInfoBox">{{dateForGraph}}</div>
        <div class="col-md-12 col-sm-12 col-xs-12 no-padding">
            <div class="col-md-4 col-sm-4 col-xs-4 odometerChartFooter">
                <div class="odometerFooterFieldValue" ng-bind="device.leftCellNumber | number"></div>
                <div class="odometerFooterFieldKey" ng-bind="device.leftCellText"></div>
            </div>
            <div class="col-md-4 col-sm-4 col-xs-4 odometerChartFooter">
                <div class="odometerFooterFieldValue" ng-bind="device.middleCellNumber | number"></div>
                <div class="odometerFooterFieldKey" ng-bind="device.middleCellText"></div>
            </div>
            <div class="col-md-4 col-sm-4 col-xs-4 odometerChartFooter">
                <div class="odometerFooterFieldValue" ng-bind="device.rightCellNumber | number"></div>
                <div class="odometerFooterFieldKey" ng-bind="device.rightCellText"></div>
            </div>
        </div>
    </div>
</div>

so that I can display each chart in separate divs. It works really well in Chrome but not in Firefox and Safari.

I'm getting this error in Firefox and Safari

https://docs.angularjs.org/error/$rootScope/infdig?p0=10&p1=%5B%5B%5D,%5B%5D,%5B%5D,%5B%5D,%5B%5D%5D

And my situation is similar to the second example they mentioned which generates a new array. However, in my situation, it will always be a new array.

I was thinking of not using ng-repeat and use $scope.chart1, $scope.chart2 etc but the problem with this approach is that I cannot tell if there will be 1, 10 or 20 charts since everything is generated dynamically. Code will be very messy!

Update: Here is the code that generates the chart objects http://pastebin.com/DmQkDHjW

devwannabe
  • 3,160
  • 8
  • 42
  • 79
  • Why will it always be a new array? What is the code that creates the array? – adam0101 Oct 01 '14 at 16:53
  • Yes, it will always be a new array. It's a function that connects to a database and grabs new data. The function will parse the data and generate a new json that Google Chart library is expecting. The output will be assigned to $scope.chartCollection – devwannabe Oct 01 '14 at 16:56
  • What event populates chartCollection and how often does it fire? Also, do you have a watch on $scope.chartCollection that modifies $scope.chartCollection? – adam0101 Oct 01 '14 at 16:59
  • I don't have a $watch on $scope.chartCollection. The $scope.chartCollection gets updated when I click buttons like changing of date, changing of device type, changing of hour range or date range. – devwannabe Oct 01 '14 at 17:28
  • This is the code - http://pastebin.com/DmQkDHjW – devwannabe Oct 01 '14 at 17:33
  • I was wrong folks until I commented out my $watch. The culprit is something inside my $watch. I don't even have a code that changes the variable that I'm watching. Continuing troubleshooting! – devwannabe Oct 01 '14 at 23:29

0 Answers0