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

时间:2016-06-14 20:11:35

标签: angularjs

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

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

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

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

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



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];
  });
}]);






<!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;
&#13;
&#13;

&#13;
&#13;
<h1>{{company.name}}</h1>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:-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
  });