我有一个带有ASP.NET应用程序的iframe,它包含UpdatePanel。我开始在应用程序中使用Angular,但由于.NET回发,事情并没有起作用。
为了解决这个问题,我使用了这个解决方案:
with (Sys.WebForms.PageRequestManager.getInstance()) {
add_endRequest(onEndRequest); // regester to the end Request
}
function onEndRequest(sender, args) {
angular.bootstrap($('#mainDiv'), ['defaultApp']);
var rootscope = angular.element('#mainDiv').scope();
if (rootscope) {
rootscope.$apply();
}
}
效果很好。
问题是当我在ASP.NET页面中动态加载不同的用户控件时,使用另一个ng-controller,Angular会抛出一个错误,说明该应用已经加载:
App Already Bootstrapped with this Element
所以问题是:如何检查应用程序是否已经自举?我可以重装这个模块吗?我可以从元素中删除它而不是再次引导它吗?
感谢。
答案 0 :(得分:16)
从应用程序外部访问范围并不是一种好的做法,因此在精心构建的生产应用程序中无法启用它。如果您需要访问/应用范围,那么您的用例会有一些奇怪/不受支持的内容。
但是,检查元素是否已被自举的正确方法是Angular库执行此操作的方式,即加载元素并检查注入器。所以你需要angular.element(document.querySelector('#mainDiv')).injector();
来代码:
function onEndRequest(sender, args) {
var element = angular.element(document.querySelector('#mainDiv'));
//This will be truthy if initialized and falsey otherwise.
var isInitialized = element.injector();
if (!isInitialized) {
angular.bootstrap(element, ['defaultApp']);
}
// Can't get at scope, and you shouldn't be doing so anyway
}
您能否告诉我们您需要应用范围的原因?
答案 1 :(得分:3)
您只需检查mainDiv
的范围,如果angular.element(document.querySelector('#mainDiv')).scope()
不是undefined
,则表示angular
尚未初始化。
您的代码如下所示。
<强> CODE 强>
function onEndRequest(sender, args) {
//below flag will be undefined if app has not bootsrap by angular.
var doesAppInitialized = angular.element(document.querySelector('#mainDiv')).scope();
if (angular.isUndefined(doesAppInitialized)) //if it is not
angular.bootstrap($('#mainDiv'), ['defaultApp']);
var rootscope = angular.element('#mainDiv').scope();
if (rootscope) {
rootscope.$apply(); //I don't know why you are applying a scope.this may cause an issue
}
}
<强>更新强>
在2015年8月下旬发布1.3版角度之后,它通过禁用调试信息来禁用调试信息,从而增加了与性能相关的改进。因此,通常我们应该将debuginfo选项设置为false,以便在生产环境中获得良好的性能提升。我不想写太多关于它的内容,因为它已经被@AdamMcCormick回答了,这真的很酷。