github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

[ML] Refactor to not rely on broadcast which could result in listeners not picking up changes. (#18717)

Browse source 
Fixes an issue where the anomaly table wouldn't load because a broadcast to renderTable was triggered before the anomaly table directive initialized the corresponding listener. This change replaces the use of broadcast and instead uses $watch to listen on scope changes on the specific attributes relevant to the updates. The updating of code in parent scopes was moved inside the $timeouts instead of the broadcast event.
This commit is contained in:
Walter Rafelsberger 2018-05-03 10:04:47 +02:00 • committed by GitHub
parent 482953c9b8
commit 0ac0e3dd5d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 21 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

3
x-pack/plugins/ml/public/components/anomalies_table/anomalies_table_directive.js
View file

@ -86,6 +86,7 @@ module.directive('mlAnomaliesTable', function (
scope.table.columns = [];
scope.table.rows = [];
scope.rowScopes = [];
scope.anomalyRecords = [];
scope.influencersLimit = 5;
@ -95,7 +96,7 @@ module.directive('mlAnomaliesTable', function (
mlSelectIntervalService.state.watch(updateTableData);
mlSelectSeverityService.state.watch(updateTableData);
scope.$on('renderTable', updateTableData);
scope.$watch('anomalyRecords', updateTableData);
element.on('$destroy', () => {
mlSelectIntervalService.state.unwatch(updateTableData);

10
x-pack/plugins/ml/public/explorer/explorer_controller.js
View file

@ -172,13 +172,11 @@ module.controller('MlExplorerController', function (
jobIds, influencers, 0, earliestMs, latestMs, 500
)
.then((resp) => {
// Sort in descending time order before storing in scope.
$scope.anomalyRecords = _.chain(resp.records).sortBy(record => record[$scope.timeFieldName]).reverse().value();
console.log('Explorer anomalies table data set:', $scope.anomalyRecords);
// Need to use $timeout to ensure the broadcast happens after the child scope is updated with the new data.
// Need to use $timeout to ensure the update happens after the child scope is updated with the new data.
$timeout(() => {
$scope.$broadcast('renderTable');
// Sort in descending time order before storing in scope.
$scope.anomalyRecords = _.chain(resp.records).sortBy(record => record[$scope.timeFieldName]).reverse().value();
console.log('Explorer anomalies table data set:', $scope.anomalyRecords);
}, 0);
});
};

6
x-pack/plugins/ml/public/timeseriesexplorer/timeseries_chart_directive.js
View file

@ -113,9 +113,9 @@ module.directive('mlTimeseriesChart', function (
drawContextChartSelection();
});
scope.$on('renderFocusChart', () => {
renderFocusChart();
});
scope.$watch('focusChartData', renderFocusChart);
scope.$watch('showModelBounds', renderFocusChart);
scope.$watch('showForecast', renderFocusChart);
// Redraw the charts when the container is resize.
const resizeChecker = new ResizeChecker(angular.element('.ml-timeseries-chart'));

29
x-pack/plugins/ml/public/timeseriesexplorer/timeseriesexplorer_controller.js
View file

@ -350,22 +350,19 @@ module.controller('MlTimeSeriesExplorerController', function (
function finish() {
awaitingCount--;
if (awaitingCount === 0) {
processDataForFocusAnomalies(
$scope.focusChartData,
$scope.anomalyRecords,
$scope.timeFieldName);
processScheduledEventsForChart(
$scope.focusChartData,
$scope.scheduledEvents);
console.log('Time series explorer focus chart data set:', $scope.focusChartData);
// Tell the results container directives to render the focus chart.
// Need to use $timeout to ensure the broadcast happens after the child scope is updated with the new data.
$timeout(() => {
$scope.$broadcast('renderFocusChart');
$scope.$broadcast('renderTable');
processDataForFocusAnomalies(
$scope.focusChartData,
$scope.anomalyRecords,
$scope.timeFieldName);
processScheduledEventsForChart(
$scope.focusChartData,
$scope.scheduledEvents);
console.log('Time series explorer focus chart data set:', $scope.focusChartData);
$scope.loading = false;
}, 0);
@ -524,16 +521,14 @@ module.controller('MlTimeSeriesExplorerController', function (
};
$scope.toggleShowModelBounds = function () {
$scope.showModelBounds = !$scope.showModelBounds;
$timeout(() => {
$scope.$broadcast('renderFocusChart');
$scope.showModelBounds = !$scope.showModelBounds;
}, 0);
};
$scope.toggleShowForecast = function () {
$scope.showForecast = !$scope.showForecast;
$timeout(() => {
$scope.$broadcast('renderFocusChart');
$scope.showForecast = !$scope.showForecast;
}, 0);
};