2路数据使用IE 11 AngularJS结合问题 [英] 2 way data binding issue using IE 11 with AngularJS

问题描述

我最近建立在我们的web应用程序中的功能，使用AngularJS和我有IE 11的一些问题无法正常 $适用（） ING数据更改DOM 。出于某种原因，这只是有时会发生，从来没有当我尝试调试，这使得它看起来像一个计时问题的问题时。

I have recently built a feature on our web application that uses AngularJS and I am having some issues with IE 11 not properly $apply()ing data changes to the DOM. For some reason this only occurs sometimes and never occurs when I try to debug the problem which makes it seem like a timing issue.

下面是功能出现问题时被调用。

Here is the function that gets called when the problem occurs.

$scope.createThrottling = function (sources) {
            MYAPP.modals.Throttling('New', sources, API, function () {
                $scope.isLoading = true;

                $scope.$apply();


                API.Migrations.getThrottles({ id: jQuery.getUrlVar('id') }, function (data) {
                    $scope.Throttles = data.Throttles;
                    $scope.isLoading = false;

                    // THE PROBLEM IS RIGHT HERE

                });


            });
        }

上面显示问题出在哪里，似乎从所产生的评论。同时在code的执行了这一点，角应自动在 $ scope.Throttling 但检查一变再进行更改的DOM据此，由于某种原因在IE 11，在页面第一次访问的绑定没有发生。

The comment above shows where the problem seems to be stemming from. At this point in the execution of the code, Angular should automatically be checking for a change in $scope.Throttling and then make a change to the DOM accordingly, however, for some reason in IE 11, on the first visit to the page the binding is not occurring.

随后刷新导致但是绑定工作，这似乎很奇怪。这是因为如果 $范围。$适用（）在 API.Migrations.getThrottles 需要的是完成了，但我不能这样做，因为角度抛出一个JS错误说，它已经被消化。

Subsequent refreshes of the page cause the binding to work however which seems very strange. It is as if $scope.$apply() is needed after API.Migrations.getThrottles is finished, but I cannot do that because Angular throws a JS error saying that it is already digesting.

需要注意以下几点：

1. 这只是发生在IE浏览器


2. 这只有可能发生在每个浏览器加载一个页面的第一次访问（我可以按F5，并尝试同样的事情，它会工作）


3. 这会不会发生，因为我的 API.Migrations.getThrottles 电话是 MYAPP.modals.Throttling 模块是完全角？

4. 当我尝试调试上面的JS功能，一切都运行得很好，这使得它看起来像一个计时问题



1. This only happens in IE
2. This only happens on the first visit to a page per load of the browser (I can hit F5 and try the same exact thing and it will work)
3. Could this be occurring because my API.Migrations.getThrottles call is inside a callback function for the MYAPP.modals.Throttling module which is outside of Angular completely?
4. When I try to debug the JS function above, everything works just fine which makes it seem like a timing issue

任何帮助寻找是什么原因造成这个错误将是非常美联社preciated！

Any help to finding out what is causing this bug would be much appreciated!

感谢

推荐答案

我想我已经找到了我的问题！我终于尝试打印一个即将从DOM服务器返回不使用调试器中的数据，我意识到，API响应不给我回新的数据！据发回缓存数据不再有效这就是为什么对象没有显示在DOM起来。这也解释了为什么使用调试器的工作原理，因为它迫使每个API调用不被缓存！

I think I have found my problem! I finally tried printing the data that is coming back from the server in the DOM without using the debugger and I realized that the API response is NOT giving me back new data! It is sending back cached data that is no longer valid which is why the objects are not showing up in the DOM. This also explains why using the debugger works because it forces each API call to not be cached!

我能够加入 {_：Date.now（）}固定在我的 $资源这个问题我在 PARAMS 对象在我的 $资源。这追加 _ = 1234567890 来所有获得此 $资源这迫使IE浏览器不缓存调用

I was able to fix this problem in my $resource by adding { _: Date.now() } in my params object in my $resource. This appends _=1234567890 to all GET calls for this $resource which forces IE to not cache

这篇关于2路数据使用IE 11 AngularJS结合问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！