页面加载后如何添加ng-app? [英] How to add ng-app after page load?
问题描述
我遇到一种情况,我想触发基于Angular的小部件 iff ,当前URL中存在查询arg.我的方法是检查(在页面加载时)是否存在arg,如果存在,则在<body>
后面添加一些标记,以使应用程序滚动:
I've got a situation where I want to trigger an Angular-based widget iff a query arg is present in the current URL. My approach is to check (on page load) if the arg is present, and if so, append a bit of markup to the <body>
that will get the app rolling:
var exampleApp = angular.module('exampleApp', []);
//init
$(function() {
var widgetMarkup = "<div ng-app=\"exampleApp\"><div ng-include=\"'/partials/widget.html'\"></div></div>";
if (window.location.href.indexOf('?arg') > -1) {
$(document.body).append(widgetMarkup);
}
});
问题:标记已添加到DOM中,但没有效果.但是,如果我将相同的标记添加到原始HTML文件中,则会拾取应用并呈现部分标记.我需要告诉Angular重新扫描页面中的指令吗?
PROBLEM: The markup is added to the DOM, but has no effect. But if I add the same markup to the raw HTML file, the app is picked up and the partial is rendered. Do I need to tell Angular to re-scan the page for directives?
推荐答案
您想要的是 angular.bootstrap
.当您的DOM准备就绪并且所有内容都已附加时,请调用它.
what you want is angular.bootstrap
. Call it when your DOM is ready and everything has been appended.
angular.bootstrap(document, ['exampleApp']);
这将在文档上开始倾斜,就像在文档上有ng-app
一样.您可以将其引导到所需的任何元素.
This will start angular on the document, as if it had ng-app
on it. You can bootstrap it to whatever element you want though.
这篇关于页面加载后如何添加ng-app?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!