Question

我正在使用Angular，我正在尝试更新ng-view的数据，当我们点击按钮但它不起作用。这是我的代码片段。主页

<body ng-app="app">

<div ng-controller="MyController" >

<a href="#" ng-click="loadDatas()">Load datas</a>

    <div ng-view></div>

    </div>

</body>

ng-view：

<div>
  {{myValue}}
</div>
<div>
<li ng-repeat ="data in datas">
  {{data.name}} || {{data.value}}
</li>
</div>

loadDatas函数：

  $scope.loadDatas = function(){
     $http.get('data.json')
       .then(function(res){
          $scope.datas = res.data;                
        });
  };

我想在点击链接时加载数据。但它不起作用。如果有人可以帮助我，我在这里plunker。感谢

Answer 1

1）

由于它是异步调用，最简单的方法是在$ timeout回调中包含var更改：

  $scope.loadDatas = function(){
     $http.get('data.json')
       .then(function(res){
          $timeout(function(){
              $scope.datas = res.data;
          }, 0);
        });
  };

这基本上强制了范围摘要，而您不必担心摘要阶段。当然，不要忘记向控制器注入$ timeout。

如果您仍想手动执行摘要，可以执行$scope.$apply()。

2）

您还需要修复您的JSON，因为我在评论中向您展示了如何：

{"name":"Dan","value":"13"},
{"name":"John","value":"34"},
etc...

3）

无需两次分配相同的控制器。

在路径中指定控制器会导致控制器生成一个新范围（每次单击该锚点时加一个，除非您删除href属性或以其他方式阻止它）。我通过删除控制器指令来修复它：

when('/', {
    templateUrl: 'partial.html'
  }).

因此，除非控制器与ng-view所在的控制器不同，否则无需指定控制器。在您的情况下，情况并非如此（您只使用了视图已经存在的控制器）并且它导致了两个不同的控制器/范围（如果单击它时锚点中存在href属性，则更多）以生成并且一个范围中的$scope.datas不是绑定到部分范围的$scope.datas。

由于父/子继承的范围，可以使用不同的变量名;因此，如果变量名称不匹配，则父范围变量将在子范围内可用，而无需特定定义。

以下是工作版本：http://plnkr.co/edit/QWPFAakvNEdJzU50LKSx?p=preview

Answer 2

您忘记注入 控制器中的$http ：

app.controller("MyController", function($scope, $http) {

看一下这个：var name changed plnkr。

Angularjs：如何加载部分数据？

2 个答案:

1）

2）

3）