My question is similar as this one, but instead of prepending row, I want it to append.
This doesn’t work:
app.directive('createTable', function ($compile) {
return {
link: function (scope, element, attrs) {
var contentTr = angular.element('<tr><td>test</td></tr>');
contentTr.parentNode.insertBefore(element, contentTr.nextSibling);
$compile(contentTr)(scope);
}
}
});
This does the job:
app.directive('createTable', function ($compile) {
return {
link: function(scope, element, attrs) {
if (element.next().length) {
element.next().insertBefore(element);
}
var contentTr = angular.element('<tr><td>test</td></tr>');
contentTr.insertAfter(element);
$compile(contentTr)(scope);
}
}
});
I think you need
app.directive('createTable', function ($compile) {
return {
link: function (scope, element, attrs) {
var contentTr = angular.element('<tr><td>test</td></tr>');
contentTr.insertAfter(element);
$compile(contentTr)(scope);
}
}
});
Demo: Fiddle
Just wanted to add something because I had some minutes until it worked. If you don't have jQuery in your project you can't use the insertAfter. Just use after() from jQuery API .after()
I needed to add some elements in my directive between to other childs.
element.children().eq(0).after(angular.element('<p>Test</p>'));
