Angularjs jqlite append() and jquery append() act differently with <td>

I'm trying to append some elements to a and I'm seeing some different behavior when using the built-in jqlite vs using jquery. I created a fiddle to demonstrate the difference: http://jsfiddle.net/waylon999/5fyBt/1/

It appears as when I do:

element.append('<td>Val 1</td><td>Val 2</td>'); // jqlite

the tags are stripped before the string is inserted. But when I try

$(element).append('<td>Val 1</td><td>Val 2</td>'); 

It works as I would expect, where the entire string arg in append is appended to the tag. I tried a couple of things including

angular.element(element).append(....)

but I can't find a way to make it work. Is there something I'm not understanding about how this should work?

Thanks!

Answers


As best I can tell, it's a bug in JQLite:

function JQLite(element) {

    ...

    if (isString(element)) {
        var div = document.createElement('div');
        // Read about the NoScope elements here:
        // http://msdn.microsoft.com/en-us/library/ms533897(VS.85).aspx
        div.innerHTML = '<div>&#160;</div>' + element; // IE insanity to make NoScope elements work!
        div.removeChild(div.firstChild); // remove the superfluous div
        JQLiteAddNodes(this, div.childNodes);
        this.remove(); // detach the elements from the temporary DOM div.
    } else {
        JQLiteAddNodes(this, element);
    }
}

As you may or may not know, you cannot do this:

div.innerHTML = '<div></div><td>asdf</td>';

The td will be removed. I'm guessing jQuery doesn't do the same thing (perhaps they're not concerned with NoScope?). That said, if you want to continue to just use Angular, this works just fine:

element[0].innerHTML += '<td>Val 1xx</td><td>Val 2yy</td>'; 

I recommend filing an issue on Angular's github.


Need Your Help

Heroku Deployment Failure

ruby-on-rails ruby heroku

Ok, so I've been at this for a little over a day now and would love to put this issue to bed. I'm doing the Hartl tutorial, Ruby on Rails Tutorial, and am at the end of chapter 1 trying to deploy m...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.