Notification system, _.template (...) .html is not a function

Question

Notification system, _.template (...) .html is not a function

Navigation

#1 by (0 votes)

0

I am making a notification system and am getting the following error:

Uncaught TypeError: _.template(...).html is not a function

Here is the code:

<script type="text/x-template" id="notifications-template">
    <ul>
        <%
        _.each(notifications, function(notification{
        if( notification.type == 1){ %>
        <li><% = notification.gig.artist.name %>has canceled the gig at <% = notifications.gig.venue at <% =notifications.gig.datetime. %></li>
            <%
        }

        }))
        %>

    </ul>

</script>
<script>
    $(document).ready(function () {
        $.getJSON("/api/notifications", function (notifications) {
            $(".js-notifications-count")
            .text(notifications.length)
            .removeClass("hide")
            .addClass("animated bounceInDown");

            $(".notifications").popover({
                html: true,
                title: "Notifications",
                content: function () {
                    var compiled = _.template("#notifications-template").html();
                    return compiled({ notifications: notifications });
                },
                placement: "bottom"
            });

        });


    });

</script>

Update

The '$' selector within _.template($("#notificação").html() was missing

But now I get an error in underscore.js

Uncaught SyntaxError: Unexpected token {

javascript html underscore.js

asked by anonymous 01.11.2016 / 17:33

1 answer

Angular Routing 2 and laravel 5.3 TableView does not update

score 0 · Accepted Answer

The syntax of both libraries are incorrect:

According to the underscore.js documentation

You need to send an HTML element as a parameter to _.template ();

For example:

var template = _.template("<b><%- value %></b>");

and select an HTML element via jQuery using:

jQuery .html () function

$("#notifications-template").html()

And in your case you put:

_.template("#notifications-template").html();

The right thing would be to place:

_.template($("#notifications-template").html());

And if the element of id notifications-template exists it will return the HTML.

At the beginning of <ul> we have some syntax errors in the closures of the functions and in the <% %> <%= %> <%- %> interpolate, try to use this code:

<ul>
    <%
        _.each(notifications, function (notification){
            if(notification.type == 1){ 
                <li><%= notification.gig.artist.name %> has canceled the gig at <%= notifications.gig.venue at%> <%=notifications.gig.datetime.%></li>
            }
        });
    %>
</ul>

To understand more about how to use the template, see these examples:

Example 1

Example 2

Example 3

And we also have this question in the stack overflow in English that is very useful, that's where I took the jsfiddle fonts: Font

I believe that above we have everything you need to solve your problem, I hope I have helped.