angularjs ng-show显示div的延迟

Question

我对Angular很新。我有一个文件输入

<input type="file" id="sampleFile" onchange="angular.element(this).scope().vm.displaySelectedXml()" />

低于它的div：

<div ng-hide="!vm.displayXml">
    <div> xml file display goes here </div>
</div>

我从here获得了onchange事件处理程序。

我的控制器js具有以下功能：

function displaySelectedXml() {
    vm.displayXml = true;
}

因此，当选择一个文件（与前一个文件或第一个文件不同）时，onchange应该触发并调用上面的fn，这将标志设置为true，然后应该显示div的内容。< / p>

问题是div需要大约30到60秒才能显示。当我在上面的函数中设置断点并选择一个文件时，立即调用该函数。我选择的文件小于1k，所以它非常小。似乎延迟发生在Angular层的某个地方。可能是这种情况吗？有人知道为什么会这样吗？提前致谢。在IE和Chrome中都会发生这种情况。

Answer 1

问题在于您从外部更改范围变量，该角度无法识别。该更改仅适用于下一个diggest周期。您可以通过添加$scope.$apply：

来解决此问题

onchange="var scope = angular.element(this).scope(); scope.vm.displaySelectedXml(); scope.$apply()"

Answer 2

达到同样效果的更简洁方法：

<input type="file" id="sampleFile" ng-change="vm.displaySelectedXml()">