angularjs - ng-repeat在数组更新时不进行更新

30 浏览
0 Comments

angularjs - ng-repeat在数组更新时不进行更新

我的AngularJS应用程序使用ng-repeat在表格中显示数据。AngularJS发出GET请求，检索一个数组。表格正确显示了数组的元素。\n页面包含一个按钮，该按钮调用一个函数来修改数组。然而，表格没有更新以反映修改后的数组。\n我尝试过以下方法：\n

    \n

  • 在更新后调用$scope.apply()。

    • \n

  • 将更新封装在一个传递给$scope.apply()的函数中，如$scope.apply(function...)。 链接

    • \n

  • 使用$timeout 链接

    • \n

\n这些尝试都没有成功。另外，我相信ng-repeat会自己调用apply()。\nAngularJS\n

\nHTML\n

    
可报告的股票代码

        添加股票
    

        

            
                符号
            
            
        

        

            
                {{ x.Ticker }}
            
            
                编辑 |
                详情 |
                删除

0

2 答案

0 Comments

问题的原因是myData变量只在myApp2模块和其控制器作用域中定义，然而显示数组表格的代码超出了模块作用域ng-app。

解决方法是将表格的HTML代码用ng-app包裹起来，这样可能会正常工作。

我已经编辑了问题，展示了我在哪里使用了ng-app。

0
0 Comments

在这个问题中，你的问题是你定义了两次控制器。

如果你调用控制器两次，它将调用同一个控制器的新实例。

这意味着你在按钮上操作的$scope与ng-repeat上的$scope不同。

你的问题演示: https://jsfiddle.net/U3pVM/26753/ (显示不同的作用域)

删除按钮父级周围的ng-controller属性，并将整个模板包装起来。

<div ng-app="myApp2" ng-controller="StocksController">
  <table class="table">
    <tr>
      <th>
        Symbol
      </th>
      <th></th>
    </tr>
    <tr ng-repeat="x in myData">
      <td>
        {{ x.Ticker }}
      </td>
      <td>
        <a href="#" ng-click='EditTicker(x.Ticker)'>Edit</a> |
        <a href="#" ng-click='DetailsTicker(x.Ticker)'>Details</a> |
        <a href="#" ng-click='DeleteTicker(x.Ticker)'>Delete</a>
      </td>
    </tr>
  </table>
  <hr />
  <div>
    <div>
      <button ng-click="SendData()">Submit</button>
      <hr />
    </div>
  </div>
</div>

工作示例: https://jsfiddle.net/U3pVM/26752/

注意: 我已经删除了内部的$http请求，仅供演示用途。

另外，由于你使用ng-click来调用SendData，所以没有必要运行scope.$apply();，因为ng-click会在内部触发一个新的脏检查循环。

被分配一些Angular JS的维护工作，在HTML中实例化控制器两次，感谢你！

0