Question

我有一个Angular应用程序，可以从本地CSV文件中读取数据。但是，有时（可能是10-20％的时间）数据似乎没有被绑定，因此我的页面缺少所有{{data}}插值。但是如果我刷新页面（有时需要多次刷新），数据最终会出现。

我无法弄清问题是什么。由于应用程序只是从本地CSV文件中读取数据，因此无法获取数据，并且该过程应该是确定性的。

此外，如果我将数据记录到控制台，控制台会正确显示数据。该页面由于某种原因不能显示它。（例如，我页面上的{{company.name}}为空，但如果我在设置console.log(company.name)变量后立即在我的代码中调用$scope.company = ....，我会看到公司名称显示在我的控制台中）

任何想法可能是什么问题？问题是Angular不知道变量是出于某种原因被设置/更新的吗？

编辑：这就是我的控制器和HTML或多或少的样子。

＆＃13;

var app = angular.module("app", ["ngRoute", "ngSanitize"]);

app.controller("CompaniesController", ["$scope", "$http", "$routeParams", "$window", "FlashService", "$location", function($scope, $http, $routeParams, $window, FlashService, $location) {
  $scope.data = [];
    
  $scope.index = parseInt($routeParams.i === undefined ? 0 : $routeParams.i);
  
  d3.csv("data/data.csv", function(data) {
    $scope.data = data;
    $scope.company = $scope.data[$scope.index];
  });
}]);

＆＃13;

<!DOCTYPE html>

<head>
  
  <title>Foo</title>
  <script src="assets/js/d3.min.js"></script>
  
  <script src="assets/js/jquery.min.js"></script>
  <script src="assets/js/underscore.min.js"></script>
  
  <script src="assets/js/angular.min.js"></script>
  <script src="assets/js/angular-route.min.js"></script>      
  <script src="assets/js/angular-sanitize.min.js"></script>

  <script src="app.js"></script>
  <script src="routes.js"></script>
</head>

<body ng-app="app">
  
<div ng-view></div>

</body>

</html>

＆＃13;

<h1>{{company.name}}</h1>

＆＃13;

Answer 1

仅当您使用$http制作XHR时，Angular才会刷新视图。

您可以通过d3.csv致电外界。因此，当数据可用时，您需要告诉Angular运行消化。

  d3.csv("data/data.csv", function(data) {
    $scope.data = data;
    $scope.company = $scope.data[$scope.index];
    $scope.$apply(); // here
  });

数据没有绑定/更新到模板？

1 个答案: