AngularJS弹窗修改ng-model值无效问题求助

问题根源 #

核心问题是跨窗口操作Angular元素时，错误使用$rootScope触发$apply，没有针对ng-repeat生成的子scope（每个输入框的独立scope）执行脏检查，同时自定义指令的逻辑存在冗余冲突（$parsers/$formatters里重复调用$setViewValue会触发循环，干扰正常ngModel流程）。

修正后的SetLatLng函数 #

直接获取输入框对应的子scope，精准触发该scope的digest循环，确保ngModel与模型同步：

function SetLatLng() {
    if (!window.opener || window.opener.closed) {
        return;
    }

    var angular = window.opener.angular;
    var txtLat = window.opener.document.getElementById(latId);
    var txtLng = window.opener.document.getElementById(lngId);

    var lat = document.getElementById('latitude').value;
    var lng = document.getElementById('longitude').value;

    if (txtLat) {
        var latElement = angular.element(txtLat);
        var latNgModel = latElement.controller('ngModel');
        var latScope = latElement.scope(); // 获取输入框所在的子scope
        
        latScope.$apply(function() {
            latNgModel.$setViewValue(lat);
            latNgModel.$render(); // 确保视图与模型同步
        });
    }

    if (txtLng) {
        var lngElement = angular.element(txtLng);
        var lngNgModel = lngElement.controller('ngModel');
        var lngScope = lngElement.scope();
        
        lngScope.$apply(function() {
            lngNgModel.$setViewValue(lng);
            lngNgModel.$render();
        });
    }

    window.close();
}

无效原因说明 #

• ng-repeat生成的每个输入框都有独立子scope，用$rootScope.$apply触发全局脏检查时，Angular可能无法精准关联到子scope的ngModel；直接用元素自身的scope.$apply，能确保该scope下的ngModel完成同步。
• 你编写的setNgModelFromValue指令逻辑错误：$parsers和$formatters是ngModel的内置转换钩子，在其中调用$setViewValue会导致无限循环，且Angular已经内置了input事件的处理逻辑，该指令不仅无效还会干扰正常流程，直接删除即可。

额外注意 #

• 确保latId和lngId是ng-repeat生成的唯一ID，比如通过id="lat-{{$index}}"动态生成，避免ID重复。
• 如果弹窗是基于Angular模态框（如UI Bootstrap Modal）实现，建议通过服务或回调函数传递值，而非直接操作DOM，这是更符合Angular规范的实现方式，能从根源避免这类DOM操作问题。

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