ng-init 没有在分页中初始化数据，angularjs

Question

我正在使用 angularjs 和 angular 分页来向用户显示详细信息。在这里，我使用 ng-init 来初始化用户的年龄。如果用户的详细信息中有年龄，那么它会显示，否则显示默认年龄 10。请参阅 Plunker

ng-init 第一次工作正常，但是当我转到下一页时，它没有显示默认年龄，即 10 岁。例如：在第3页中，名字是name30，没有年龄。所以，年龄应该来自默认年龄。

Answer 1

删除 ng-init 逻辑并且你应该将 UI 逻辑移动到你的控制器

标记

<h4>Limit the maximum visible buttons</h4>
<p> NAME: {{user.name}}</p>
AGE:  <input ng-model="user.age">

代码

  // assign value on page change.
  $scope.loadRecord = function(page) {
    $scope.user = $scope.users[page - 1] || {};
    $scope.user.age = $scope.user.age || 10;
  };

  $scope.loadRecord(1); //default load 1st page

Working Plunkr

Answer 2

ngInit 指令允许您计算当前范围内的表达式。您的方法的问题是 ngInit 在创建范围时仅被调用一次 - 因此它仅适用于第 1 页。

另请查看 AngularJs documentation 中的内容：

The only appropriate use of ngInit is for aliasing special properties of ngRepeat, as seen in the demo below. Besides this case, you should use controllers rather than ngInit to initialize values on a scope.

因此，根据此建议，最好在控制器中设置默认年龄值，例如：

  // assign value on page change.
  $scope.loadRecord = function(page) {
    $scope.user = $scope.users[page-1];

    if (!$scope.user.age) {
      $scope.user.age = 10;
    }
  };

  // initial value
  $scope.loadRecord(1);

请查看此 Plunker 以实际使用它。

ng-init 没有在分页中初始化数据，angularjs

ng-init not initialize data in pagination, angularjs

pagination

angularjs

angularjs-ng-init