如何强制更新ng-init？咨询rowIndex更新后ng-init未同步的替代方案

嘿，这个问题我太熟了！ng-init的特性就是只在元素初始化的时候执行一次，不管后续依赖的变量（比如你的rowIndex）怎么变化，它都不会重新触发执行，所以你哪怕用$timeout改了rowIndex，item也不会跟着更新。你那个ng-repeat的取巧写法虽然能work，但确实有点hacky，给你几个更优雅靠谱的替代方案：

方案1：直接使用控制器中的计算函数 #

在控制器里定义一个能根据当前rowIndex返回对应item的函数，然后直接在模板里调用它。这种方式最简单直接，适合逻辑不复杂的场景：

控制器代码：

// 假设你的getItem已经定义在$scope上
$scope.getCurrentItem = function() {
    return $scope.getItem($scope.rowIndex);
};

模板代码：

<div> {{ getCurrentItem().Name }} </div>

如果rowIndex是在子作用域中（比如嵌套指令里），可以把它作为参数传进去：

<div> {{ getCurrentItem(rowIndex).Name }} </div>

注意：Angular的脏检查会在每次digest循环时执行这个函数，如果getItem逻辑比较复杂，可能会影响性能，这时候可以考虑加个简单的缓存，比如把上次的rowIndex和对应的item存起来，只有当rowIndex变化时才重新调用getItem。

方案2：用$watch监听rowIndex的变化 #

在控制器里监听rowIndex的变化，一旦它更新，就手动调用getItem来更新item。这种方式性能更好，因为只有当rowIndex真正变化时才会执行逻辑：

控制器代码：

// 初始化时先获取一次
$scope.item = $scope.getItem($scope.rowIndex);

// 监听rowIndex的变化
$scope.$watch('rowIndex', function(newRowIndex, oldRowIndex) {
    // 避免初始时重复执行（可选）
    if (newRowIndex !== oldRowIndex) {
        $scope.item = $scope.getItem(newRowIndex);
    }
});

模板代码就可以直接使用绑定好的item：

<div> {{ item.Name }} </div>

方案3：封装自定义指令（适合复用场景） #

如果这个“根据rowIndex动态获取item”的场景在你的项目里经常出现，不如封装一个自定义指令，把逻辑封装进去，更模块化也更好维护：

指令代码：

angular.module('yourApp').directive('dynamicItem', function() {
    return {
        scope: {
            // 双向绑定rowIndex
            rowIndex: '=',
            // 传递getItem函数，注意这里的参数名要和模板里对应
            getItem: '&'
        },
        link: function(scope) {
            // 定义更新item的函数
            var updateItem = function() {
                // 通过&调用外部的getItem函数，传入index参数
                scope.item = scope.getItem({ index: scope.rowIndex });
            };

            // 监听rowIndex变化，更新item
            scope.$watch('rowIndex', updateItem);
            // 初始化时先执行一次
            updateItem();
        },
        // 自定义模板，也可以通过transclude传递内容
        template: '{{ item.Name }}'
    };
});

模板里使用这个指令：

<div dynamic-item row-index="rowIndex" get-item="getItem(index)"></div>

这三种方案里，我个人推荐优先用方案2（$watch），它性能最优，逻辑也清晰；如果是简单场景，方案1足够用；如果需要多次复用，方案3是最佳选择。

内容的提问来源于stack exchange，提问作者Pablo Honey