在AngularJS控制器中調用外部函數

我正在尋找運行從REST端點收集數據的外部JS函數，因此需要花費少量時間來執行此操作。這些數據將被插入圖表中，但圖表正試圖在收集數據之前加載。在AngularJS控制器中調用外部函數

外部JS：

function callEndpoint() { 
    var sensorID = document.getElementById('sensorList').value; 
    $.getJSON('http://193.61.148.125:443/SensorCentral/REST/SensorDataRangeNanos/19455746_3_10?startTs=0&endTs=9000000000000000000', 
    function(data) { 
     globalData = data; 
    }); 
}

我root.js：

angular.module('root',['AngularChart'], function($routeProvider, $locationProvider){ 
    $routeProvider.when('/',{ 
     template: '<chart title="Bedroom Sensors" xData="lineChartXData" yData="lineChartYData" xName="Month" yName="Activations" subtitle="Sensor Usage"></chart>', 
     controller: MainCtrl 
     }) 
})

我在使用服務的嘗試：

angular.module('root',['AngularChart'], function($routeProvider, $locationProvider){ 
     service('myService', function() { 
      this.callAlert = function() { 
       callEndpoint(); 
     }}); 
    $routeProvider.when('/',{ 
     template: '<chart title="Bedroom Sensors" xData="lineChartXData" yData="lineChartYData" xName="Month" yName="Activations" subtitle="Sensor Usage"></chart>', 
     controller: MainCtrl 
     }) 
})

編輯：

我訪問globalData雖然MainCtrl函數調用（popGraph()）：

function MainCtrl($scope, $http){ 
    callEndpoint(); 
    var data = {"xData": ["Mon", "Tues", "Wed", "Thurs", "Fri", "Sat","Sun"],"yData":[{ 
     "name": "Door", 
     "data": [7.0, 6.9, 9.5, 14.5, popGraph(), 21.5, 25.2] 
    }, { 
     "name": "Drawer", 
     "data": [2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8] 
    }, { 
     "name": "Cupbaord 1", 
     "data": [9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6] 
    }, { 
     "name": "Cupboard 2", 
     "data": [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0] 
    }]}   
    $scope.lineChartYData=data.yData 
    $scope.lineChartXData=data.xData 
}

來源

2017-05-26 Colin747

，您是否試圖使用'resolve'？ – Pradeepb

嘗試承諾：https：//api.jquery.com/jquery.when/ –

@Pradeepb您可以協助語法嗎？ – Colin747

如果定義在主腳本的功能，無需使用閉包，你的函數實際上是必然要在JavaScript window對象。所以，你的代碼中，你可以隨時撥打：

console.log(window.callEndpoint);

，這將顯示在控制檯的功能。此外，假設您的腳本已插入頁面中，並且沒有用於更改範圍的閉包。

然後從角路由你可以很容易地使用決心塊：

$routeProvider.when('/',{ 
     template: '<chart title="Bedroom Sensors" xData="lineChartXData" yData="lineChartYData" xName="Month" yName="Activations" subtitle="Sensor Usage"></chart>', 
     controller: 'MainCtrl', 
     resolve: { 
      myData: function() { 
      return window.callEndpoint().then(function(data) { return data; }); 
      } 
     } 

     })

內。然後控制器MainCtrl注入myData的，你應該有你的數據準備上初始化。

更改功能以這種方式獲取數據：

function callEndpoint() { 
    var sensorID = document.getElementById('sensorList').value; 

return 
$.getJSON('http://193.61.148.125:443/SensorCentral/REST/SensorDataRangeNanos/19455746_3_10?startTs=0&endTs=9000000000000000000').then(function(data) { 
    function(data) { 
     return data; 
    }); 
    }) 
}

來源

2017-05-26 14:21:19 quirimmo

我收到一個錯誤，指出'globalData是未定義的（我實現了你添加一個return和調用函數的建議）。 'globalData'被聲明在我的外部'js'文件的頂部。 – Colin747

我的意思是說，我正在'MainCtrl'函數內部訪問'globalData'，我將它添加到我原來的問題中。 – Colin747

我看到你的編輯和禁止，這將無法正常工作。我正在編輯我的答案，但請使用上面顯示的解決方案 – quirimmo

在AngularJS控制器中調用外部函數

回答

相關問題