首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Angular1 - ng-repeat from a function不会在底层模型更改时更新

Angular1是一个流行的前端开发框架,它使用了双向数据绑定的概念来实现数据的自动更新。在Angular1中,ng-repeat指令用于循环遍历一个数组或对象,并将其中的每个元素渲染到页面上。

当使用ng-repeat从一个函数中获取数据时,Angular1会在每次脏检查时调用该函数来获取最新的数据。然而,如果底层模型发生了更改,但函数返回的数据没有发生变化,ng-repeat指令将无法检测到这些更改,并且页面不会更新。

为了解决这个问题,可以使用Angular1中的$watch函数来监视底层模型的变化,并在变化时手动更新ng-repeat所使用的数据。具体步骤如下:

  1. 在控制器中定义一个函数,该函数返回需要在ng-repeat中循环的数据。
  2. 使用$watch函数监视底层模型的变化。当底层模型发生变化时,$watch函数会被触发。
  3. 在$watch函数中,更新ng-repeat所使用的数据,以便页面可以正确地显示最新的数据。

以下是一个示例代码:

代码语言:txt
复制
angular.module('myApp', [])
  .controller('myController', function($scope) {
    $scope.getData = function() {
      // 从底层模型获取数据的逻辑
      return [1, 2, 3];
    };

    $scope.$watch(function() {
      // 监视底层模型的变化
      return $scope.getData();
    }, function(newData, oldData) {
      // 当底层模型发生变化时,更新ng-repeat所使用的数据
      $scope.items = newData;
    });
  });

在上面的示例中,$scope.getData函数用于获取需要在ng-repeat中循环的数据。$watch函数监视getData函数的返回值,并在变化时更新$scope.items,以便ng-repeat可以正确地显示最新的数据。

推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云数据库MySQL。腾讯云云服务器提供可靠的计算能力和网络环境,适用于部署和运行前端和后端应用程序。腾讯云云数据库MySQL提供高性能、可扩展的关系型数据库服务,适用于存储和管理应用程序的数据。

腾讯云云服务器产品介绍链接:https://cloud.tencent.com/product/cvm 腾讯云云数据库MySQL产品介绍链接:https://cloud.tencent.com/product/cdb_mysql

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券