Меняя {{#each session.user.notification.notidata.[0]}} на это: {{#each session.user.notification.notidata}} работал над моим примером веб-приложения, которое я создал, чтобы смоделировать настройку вашего веб-приложения.Для простоты я смоделировал объект сеанса: (из вашего массива UserSchema и примера notidata) и создал простой шаблон рукоятки, содержащий список, с помощью data.properties, которые вы хотите (para и заголовок)) . HTML в этом случае не имеет значения, поскольку это может быть что угодно, просто нужно показать, что {{#each}} аннотация handlebarjs сработала так, как и ожидалось в вашем шаблоне. Я подозреваю, что проблема в вашеммассив уведомлений и по той или иной причине этот массив содержит только 1 элемент.Ниже вставлены соответствующие файлы примера веб-приложения, чтобы увидеть весь пример проекта, пожалуйста, посмотрите здесь: https://github.com/nathanwright1242/handlebarTest.
Index.html ( обратите внимание на handlebarjsловушка шаблона: handlebarsTmpl )
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Handlebarjs Templating example</title>
<meta name="description" content="The HTML5 Herald">
<meta name="author" content="SitePoint">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<div id='handlebarHook'></div>
</head>
<body>
<script id="handlebarsTmpl" type="text/template">
<div>
{{#each session.user.notification.notidata}}
<ul class="list-group">
<li class="list-group-item">{{data.heading}}</li>
<li class="list-group-item">{{data.para}}</li>
</ul>
{{/each}}
</div>
</script>
<!-- bootstrap4 dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
<!-- backbonejs dependencies -->
<script src='js/lib/underscore-min.js'></script>
<script src='js/lib/backbone-min.js'></script>
<!-- handlebarsjs -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.js"></script>
<!-- normal app separation -->
<script src='js/views/HandleBarView.js'></script>
<script src='js/app.js'></script>
</body>
</html>
HandleBarView.js ( Представление, которое заполнит шаблон руля динамическими данными из объекта сеанса)
var app = app || {}
app.HandleBarView = Backbone.View.extend({
el: '#handlebarHook',
template: $('#handlebarsTmpl').html(),
initialize: function(notidata){
this.notidata = notidata;
this.render();
},
render: function(){
let templateScript = Handlebars.compile(this.template);
this.$el.html(templateScript( this.notidata ));
return this;
}
});
app.js ( Точка входа в веб-приложение, передавая объект сеанса: смоделировано так же, как ваша схема и пример данных )
var app = app || {};
$(function() {
let data = {
session: {
user: {}
}
};
data.session.user = {
'username': 'testuser',
'email': 'test@gmail.com',
'password': 'password',
'company': 'myCompany',
'contact': 1234,
'country': 'United States',
'isLoggedIn': true,
'createdOn': '2018-09-27T22:59:41.655Z',
'ads': [],
'notification': {
'counter': 1,
'notidata': [
{ data: { heading: 'Welcome edited', para: 'MaujouharatMarketPlace welcomes you!' }, read: false, itemdate: '2018-09-27T22:59:41.655Z' },
{ data: { heading: 'This is second notification', para: 'yes man' }, read: false, itemdate: '2018-09-27T22:59:41.655Z' }
]
}
};
new app.HandleBarView(data);
});
Результат: (проверка кода путем просмотра индексного файла проекта)
