JavaScript訪問Angular範圍返回「undefined」 - 異步問題？

Question

問題：我試圖從服務器獲取一些數據來填充cytoscape圖。當我訪問範圍從JavaScript其未定義。

儘管他們是相當有這種/類似的問題，幾個帖子。一旦數據準備就緒（如果這是我所遇到的問題），我無法找到關於如何從JavaScript文件中訪問範圍的問題的解釋。

，我讀了http.get方法都是異步的？所以它們在執行後不會阻塞任何東西。我想這是什麼導致一個未定義的錯誤，當我訪問範圍，因爲數據還沒有返回？我已經找到了一些這方面的信息，但無法弄清楚用什麼來解決問題。我可以通過HTML中常見的方式使用角花括號來訪問數據，並且它可以工作。當我從控制器返回一些數據時，它也可以工作。

如果任何人都可以點我在正確的方向我會很感激。

這是JavaScript文件我嘗試運行的抓住範圍和添加節點到Cytoscape的曲線圖。

<script type="text/javascript"> 
    window.onload = function() { 
     nodes = angular.element(document.querySelector('[ng-controller="DataController"]')).scope().nodes; 
     alert(nodes); 
     cy.add(nodes); 
    } 
</script> 

2.從控制器調用工廠方法。

dataFactory.getNodes().then(function(data) 
    { 
     $scope.nodes = data; 
    }); 

3. http.get從工廠

_service.getNodes = function() 
    { 
     return $http.get(urlBase + "/nodes"); 
    }; 

4的Node.js返回一些 '節點' 添加到Cytoscape的圖形

router.get('/api/data/nodes', function(req, res) { 
     console.log('sending some data'); 
     var data = [ 
      ... 
      ]; 
     res.status(200).json(data); 
    }); 

我見過「承諾「，所以我想我會朝那個方向前進...

謝謝

Answer 1

您試圖在加載DOM（window.onload）時警告節點的值，並且服務中的數據尚未返回。 您的控制器已經使用了承諾，並且在解決承諾時數據綁定到範圍。

.then(function(data){ 
    ... 
}); 

如果你特別希望從外部js腳本訪問這些數據，你可以簡單地從控制器調用該函數：

腳本

<script type="text/javascript"> 
function alertNodes() { 
    nodes = angular.element(document.querySelector('[ng-controller="DataController"]')).scope().nodes; 
    alert(nodes); 
    cy.add(nodes); 
} 
</script> 

控制器

dataFactory.getNodes().then(function(data){ 
     //$scope.nodes = data; 
     alertNodes() 
    });