在我的 Angular 应用程序 (1.4) 中,我在网格中有一个控件,该控件可能是多种类型之一,因此我创建了一个 JavaScript 函数来执行逻辑并吐出应输入的标记。
但是它无法正常工作。标记将呈现,但其中似乎没有任何 Angular Hook 。以我有限的理解,我认为原因与这个消化周期/时间有关。我还怀疑我的代码应该在指令中,但不确定。
我创建了一个演示程序来解决这个问题。 https://plnkr.co/edit/nuxFzqN0n6XgSHqmC6jK?p=info这是标记。访问plunk查看js并运行:
<body ng-controller="MainCtrl">
<div>Button1: <input type="button" value="Button 1" ng-click="button1click()"/><span ng-show="showButton1Result">BUTTON 1 CLICKED!</span></div>
<div>Button2: <span ng-bind-html="button2Markup()"></span></div>
<div>Button3: {{ button3Markup }}</div>
</body>
你明白了。这里最好的方法是什么?
最佳答案
这已在其他地方得到回答:Programmatic Angular Templates?
指令是您要使用的内容:
<div>Button 2: <div programatic-button="button2Markup()"></div></div>
<div>Button 3: <div programatic-button="button3Markup"></div></div>
.directive('programaticButton', function($compile) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
var html = scope.$eval(attrs.programaticButton);
var newElement = $compile(html)(scope);
element.append(newElement);
}
};
});
关于javascript - 如何将编程标记添加到我的 Angular 页面中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38748285/