Javascript внутри шаблона Mustache.js

У меня есть список пользователей, исходящих из back-end, и я добавляю каждый из них на мою HTML-страницу, как показано ниже. Моя цель - иметь систему оценки javascript для каждого пользователя.Javascript внутри шаблона Mustache.js

<head> 
<link href="/css/rateyo.css"/> 
<script src="/js/rateyo.js"/> 

<script type="text/template" id="mustache-template"> 

{{#user}} 
<li> 
    {{name}} 
    <div id="rating"></div> 
</li> 
{{/user}} 
</script> 

<script> 
$("#rating").rateYo().on("rateyo.set", function (e, data) { 
}); 
</script> 

</head> 

<body> 
<ul> 
    <!-- All the individual users will be in their own li element here --> 
</ul> 
</body>

Все работает, кроме моего рейтингового скрипта. Он должен сделать пять звезд рядом с каждым пользователем. Но я слышал, что вы не можете помещать скрипты внутри шаблонов, правильно? Если я переместил это <div id="rating"/> в другое место, он будет работать так, как будто он предназначен и показывает звезды.

Что мне делать? Я не могу поместить этот скрипт вне своих шаблонов.

источник

2014-12-31 Tom Joad

Адрес электронной почты: Остальная часть вашего кода? – Nit

Речь идет не о JavaScript внутри шаблонов, не так ли? В том, что вы опубликовали, нет JavaScript. Это действительно о том, как получить JavaScript, чтобы знать, что он должен действовать на недавно добавленные части DOM, не так ли? Что такое «сценарий оценки»? – Pointy

Я оставил часть JS, потому что, хотя это объяснение будет работать. Я редактировал OP. –

Вы можете добавить свою функцию к объекту, который вы пытаетесь проанализировать с помощью шаблона, а затем вызвать функцию в своем шаблоне.

var userlist = { 
     user: [ 
      {name: 'name nameson', doRating: function() {someOtherFunction();}}, 
      {name: 'some otherguy', doRating: function() {someOtherFunction();}} 
     ] 
    }; 

    var someOtherFunction = function() { 
     $("#rating").rateYo().on("rateyo.set", function (e, data) { 
      //Do stuff? 
     }); 
    } 

    <script type="text/template" id="mustache-template"> 
     {{#user}}<li>{{name}} <div id="rating"></div></li>{{/user}}{{doRating}}; 
    </script>

Или вы могли бы, конечно, рассчитать рейтинг по заранее, и реализовать какой-то {{user.rating}} и использовать его для создания в шаблоне.

Или, когда я смотрю поближе, вы можете просто добавить слушателя после того, как усы сделаны рендерингом. Так как рейтинг div # будет доступен (что действительно должно быть классом btw).

Это был бы мой подход, по крайней мере.

источник

2015-08-04 12:10:11 jthanto

Javascript внутри шаблона Mustache.js

ответ

Смежные вопросы