Question

注意：我们的项目不允许使用范围。我们以angular2方式编写angular1代码。
我正在尝试在“点击”项目中显示警告文本以获取帮助图标。我已经动态地将锚标签添加到DOM，如下所示（控制器逻辑）。我正在通过CLASS限制指令...因此，您可以在锚标记的class属性中看到指令名称。

var helpTextData = {
          "myData" : {
            "helpIcon1" : "help text 1"
          };
    this.addHelpIconsAndText = function (sectionName) {
                for(var tagID in helpTextData[sectionName]){
                    var domNode = angular.element(document.querySelector('#'+tagID));
                    domNode.append('<a href="#" class="help-popover" data-toggle="popover" data-placement="top" title="help" data-content="'+helpTextData[sectionName][tagID]+'"><span class="glyphicon glyphicon-question-sign"></span></a>');
                }
            };

HTML

<div class="form-label col-md-4 col-sm-5" id="helpIcon1">
                                <label>Taxable amount :</label>
                            </div>

指令

.directive('helpPopover', function(){
            return {
                priority: 1001,
                restrict: 'C',
                link: function(scope, element){
                          element.on('click', function () {
                              alert('Hi');
                          });
                }
          };
      });

这似乎不会在点击时生成警报。但是，如果我手动在HTML中添加锚标记，如下所示，它的效果非常好。

<a href="#" class="help-popover" data-toggle="popover" data-placement="top" title="help" data-content="b">Button</a>

我见过$ compile，但我不应该在我的项目中使用范围变量。谁能给我一个解决方案？

动态生成的HTML DOM节点的Angular指令？

0 个答案: