动态创建角度视图
动态创建角度视图
提问于 2012-08-21 06:30:59
我正在使用awesomium制作游戏中的用户界面，在某些情况下，游戏加载并执行一大块javascript，这意味着要创建任意的新用户界面元素。例如：
jQuery(document.body).append('<span class="game-status-alert">You Lose!</span>');这很好用，当我想创建一些稍微高级一些的UI元素时，问题就来了，特别是使用angular。例如，如下所示：
function ChatBoxControl($scope) { /* Stuff */ }
jQuery(document.body).append(
'<div ng-controller="ChatBoxControl"><div ng-repeat="line in chat"><span>{{line}}</span></div></div>'
);毫不奇怪，这不会创建新的角度视图。它只是将该html添加到文档中，而从不绑定到ChatBoxControl。
我如何在这里实现我想要做的事情呢？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-08-21 14:30:53
你应该$compile动态添加的angular内容。类似于：
jQuery(document.body).append(
$compile(
'<div ng-controller="ChatBoxControl"><div ng-repeat="line in chat"><span>{{line}}</span></div></div>'
)(scope)
);可以使用以下命令获取的任何元素的作用域：
var scope = angular.element('#dynamicContent').scope();此外，您还应该获得可以注入到其他控制器中的$compile。
另请参阅：AngularJS + JQuery : How to get dynamic content working in angularjs
Stack Overflow用户
发布于 2012-08-21 08:31:49
您可能希望结合使用ng-include和ng-repeat。下面是一个简单的例子：http://plunker.no.de/edit/IxB3wO?live=preview
<div ng-repeat="dom in domList" ng-include="dom"></div>Parent $scope将保留加载到视图中的部分列表。ng-repeat + ng-include将根据列表迭代并显示分词。
当时机合适时，您可以将部分添加到dom列表中。例如：
$scope.domList.push("chatbox.html");(顺便说一句，把DOM操作放到控制器中不是角度的方式。)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12046129
复制相关文章
相似问题