nvd3 ошибка угловой директивы: [$ rootscope: infdig] Достигнуто 10 $ digest() итераций. прерывание

Question

nvd3 angular error: [$rootscope:infdig] 10 $digest() iterations reached. aborting!

Я получаю эту ошибку, используя угловую директиву nvd3. Afaik эта ошибка возникает, когда вы изменяете модели из представления. Но я не думаю, что я это делаю.

Вот код:

//controller 

var options = getChartOptions(); 
var data = getChartData(); 

$scope.chart = { 
    data: data, 
    options: options 
}; 

//view 

<nvd3 class="metrics-chart" options="chart.options" data="chart.data"></nvd3> 

Вот полный контроллер:

var options = getChartOptions(); 
var data = getChartData(); 

$scope.chart = { 
    data: data, 
    options: options 
}; 

function getChartOptions(){ 
    return ChartConfigService.getChartOptions(); 
} 


function getChartData(){ 
    var data = []; 
    var colors = { 
     'GET': '#f00', 
     'POST': '#0f0', 
     'PUT': '#00f', 
     'DELETE': '#ff0' 
    }; 

    var verbs = ['GET', 'POST', 'PUT', 'DELETE']; 

    verbs.forEach(function(verb){ 
     var i = 0; 
     var values = []; 
     var now = moment(); 

     while (i < 10) { 
      values.push({ 
       x: moment(now).add(i, 'minutes'), 
       y: Math.round(Math.random() * 10) 
      }); 

      i++; 
     } 

     data.push({ 
      values: values,  //values - represents the array of {x,y} data points 
      key: verb, //key - the name of the series. 
      color: colors[verb] //color - optional: choose your own line color. 
     }); 
    }); 

    return data; 
} 

Answer 1

Эта ошибка возникает из-за того, что некоторое неопределенное свойство в настройках неправильно назначенный по умолчанию, и постоянно меняется. В моем случае это была высота. Когда я указал его в настройках, ошибка исчезла

Answer 2

Ваша служба, похоже, может создать новый объект здесь:

ChartConfigService.getChartOptions(); 

Если это так ...

Проблема: AFAIK есть будет новым наблюдателем в этом новом объекте, ведущем к другому циклу $ digest. Я предполагаю, что в директиве «nvd3» используют двухсторонний-привязки данных на «варианте» и пытаются решить это снова приводит к другому рекурсивному вызову:

ChartConfigService.getChartOptions(); 

Решение: ли не возвращает новый объект внутри:

ChartConfigService.getChartOptions(); 

- ИЛИ -

// var options = getChartOptions(); 
// function getChartOptions(){ ... } 
var options = ChartConfigService.getChartOptions(); 

- ИЛИ -

var optionsData = ChartConfigService.getChartOptions(); 
function getChartOptions(){ 
    return optionsData; 
}