AngularJS Jqlite后不添加元素答案

【问题标题】：AngularJS Jqlite after doesn't add elementAngularJS Jqlite后不添加元素
【发布时间】：2015-01-12 13:28:06
【问题描述】：

考虑这个可运行的例子：为什么 el4 没有放在 el3 之后？如果我调试并打印 el3 似乎 el4 已经消失了。如何将一个元素放在另一个元素之后，使它们成为兄弟姐妹？

编辑：我不想在调用 .after() 之前附加 el3。我只是有两个 angular.elements 我想将它们组合成两个兄弟姐妹，并在指令元素中附加或替换它们。

angular.module('myModule', []) 


.directive('mydir', [function () {
    return {
        restrict: 'E',
        scope: {},
        template:'<div><b>{{myf.str}}</b>',
        link: function (scope, elem, attrs, ctrl) {
          
          
            var el = angular.element('<b>First </b>');
            var el2 = angular.element('<i>Second</i><br>');
            el.append(el2);
            elem.append(el);
          
          
            var el3 = angular.element('<b>Third </b>');
            var el4 = angular.element('<i>Fourth</i>');
            el3.after(el4);
            elem.append(el3);
          
            
        }
    };
}])

<html ng-app='myModule'>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>


<mydir></mydir>

【问题讨论】：

好吧，el3 尚未附加，所以el3.after(el4); 将不起作用。如果您切换他们的位置，它将起作用 - plunker
感谢 Vucko，但我想在添加或替换之前将元素作为兄弟姐妹添加在一起。
有多种方法可以做到这一点。你到底想达到什么目标？
Vucko，我有两个 angular.elements，我只想将它们作为兄弟对象添加在一起。然后我只想将兄弟对象附加到dom，element.append(s)。

标签： javascript angularjs angularjs-directive jqlite

【解决方案1】：

angular.module('myModule', [])


.directive('mydir', [
  function() {
    return {
      restrict: 'E',
      scope: {},
      template: '<div><b>{{myf.str}}</b>',
      link: function(scope, elem, attrs, ctrl) {


        var el = angular.element('<b>First </b>');
        var el2 = angular.element('<i>Second</i><br>');
        el.append(el2);
        elem.append(el);


        var el3 = angular.element('<b>Third </b>');
        var el4 = angular.element('<i>Fourth</i>');

        elem.append(el3);
        elem.after(el4);


      }
    };
  }
])

<html ng-app='myModule'>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>


<mydir></mydir>

【讨论】：

感谢 sylwester，但我想先将这两个元素作为 sibligs 添加在一起，然后再将它们附加在一起。