Question

我需要对附加了指令的元素应用条件修改，然后将其放入新模板中。我不想覆盖＆＃39;它

我还没想到它，谢谢顺便说一句！

我知道我可以使用translude，但我希望能够有条件地修改模板。

HTML：

<directive-name></directive-name>

JS：

.directive('directiveName', function($compile) {
  return {
    restrict: 'E',
    link : {
      pre: function(scope, iElement, iAttributes) {
        if(condition) {
          iElement.attr('a-attribute', "field")
          break;
        }
        else {
          iElement.attr('b-attribute', "field")                     
          break;
        }
        var template =
          '<pre>' + // Some very cool template here
            iElement.html() + // Here it's where it doesn't work :(
          '</pre>';
        newElement = $compile(template)(scope);
        iElement.replaceWith(newElement);     
       }
     },
   }
})

Answer 1

尝试这样的事情：

.directive('nsDirective', ['$compile', function($compile) {
    return {
        restrict: 'AE',
        controller: 'nsDirectiveCtrl',
        link: function(scope, element, attributes, controller) {
            var build = function () {
                var html = '';
                if (attributes.type === 'a') {
                    html = '<div ns-directive-a></div>';
                }
                element.empty().append($compile(html)(scope));
            };
            // Init
            build();
        }
    };
}])

Answer 2

知道了！

我需要iElement [0] .outerHTML！

'<pre>' + // Some very cool template here
  iElement[0].outerHTML
'</pre>';

修改angularjs指令中的元素并将其重新注入模板中

2 个答案: