使用Angularjs,
我希望隐藏ng-view直到所有XHR都已解决。因为默认情况下,视图将在XHR仍在解析时显示。
当XHR不快时(例如:.net IIS应用程序预热)这是一个问题,并且在XHR解决之前屏幕显示给用户。
问题的一个例子:我有一个屏幕,其中包含从XHR填充的选择列表和一个使用从XHR返回的数据构建的锚点href字符串。如果用户在XHR解析之前尝试使用选择列表或单击锚点,则会出现意外行为。一个空的选择列表。一个无法正常工作的锚。
我宁愿不使用ng-show或ng-disable以及控制器中的一堆标志和逻辑来丢弃视图。
我的想法是隐藏整个ng-view,直到所有XHR都被解析,然后显示ng-view。这样我就可以避免使用属性乱丢模板,并避免在控制器中难以维护复杂的逻辑。
我认为angular不会提供我可以使用$ on捕获的事件,因此这不是解决方案。
我想出了这个,但我不确定这是做我想做的最好的方法。你觉得怎么样?
纳克视
package test;
import java.io.File;
import java.io.IOException;
public class FilePaths {
public static void main(String[] args) throws IOException {
String[] fileArray = {
"C:\\projects\\workspace\\testing\\f1\\f2\\f3\\file5.txt",
"folder/file3.txt",
"../testing/file1.txt",
"../testing",
"f1/f2"
};
for (String f : fileArray) {
displayInfo(f);
}
}
public static void displayInfo(String f) throws IOException {
File file = new File(f);
System.out.println("========================================");
System.out.println(" name:" + file.getName());
System.out.println(" is directory:" + file.isDirectory());
System.out.println(" exists:" + file.exists());
System.out.println(" path:" + file.getPath());
System.out.println(" absolute file:" + file.getAbsoluteFile());
System.out.println(" absolute path:" + file.getAbsolutePath());
System.out.println("canonical file:" + file.getCanonicalFile());
System.out.println("canonical path:" + file.getCanonicalPath());
}
}
家长控制器
_.debounce = function (func) { return function () { func.apply(this, arguments);}; };
xhrService
<div ng-controller="parentController">
<div class="ng-cloak"
ng-cloak
ng-view
ng-show="dataReady">
</div>
</div>
儿童控制器
angular.module("myApp").controller("parentController",
["$scope"
function ($scope) {
$scope.$on("$routeChangeStart", function () {
$scope.dataReady = false;
});
$scope.$on("loading:dataReady", function () {
console.log("Data Ready");
$scope.dataReady = true;
});
}
]);