Создание частичного с Handlebars - PullRequest
Новая
       50

Создание частичного с Handlebars

1 голос
/ 10 января 2020

Я новичок на сайте в целом, и я не могу понять, как создать партию при использовании руля.

Я пытаюсь использовать партиал для моей навигационной панели, поэтому мне не нужно копировать его в каждый файл руля и менять все после любого изменения. Большинство мест, которые я видел в Интернете, используют express. Когда я посмотрел руководство по рулю, частичное создание включает:

Handlebars.registerPartial ("myPartial", "{{name}}");

Я не понимаю, что {{ name}}, я попытался включить {{UserType}}, но тогда он отображал бы только Admin вверху страницы, а не содержимое части панели навигации.

При использовании Handlebars.registerPartial я понимаю, что Первый параметр - это имя частичного. Который я создал в той же папке представлений, и я создал ее в папке partials на случай, если это будет проблемой. Я не понимаю, каким должен быть второй параметр, и если я оставлю это поле пустым, он выдаст ошибку «Ошибка: попытка зарегистрировать часть с именем navBar как неопределенную».

Любая помощь будет в значительной степени Спасибо, спасибо.

Вот важные файлы: index. js

#!/usr/bin / env node

//Routes File

'use strict'

/* MODULE IMPORTS */
const Koa = require('koa')
const Router = require('koa-router')
const views = require('koa-views')
const staticDir = require('koa-static')
const bodyParser = require('koa-bodyparser')
const session = require('koa-session')
const path = require('path')

const Handlebars = require('handlebars')
Handlebars.registerPartial('navBar', ???)

const app = new Koa()
const router = new Router()

/* CONFIGURING THE MIDDLEWARE */
app.keys = ['darkSecret']
app.use(staticDir('public'))
app.use(bodyParser())
app.use(session(app))
app.use(views(`${__dirname}/views`, { extension: 'handlebars' }, { map: { handlebars: 'handlebars' } }))

const home = require('./routes/home.js')
const user = require('./routes/user.js')
const restaurant = require('./routes/restaurant.js')
const review = require('./routes/review.js')

const defaultPort = 8080
const port = process.env.PORT || defaultPort

/*Session Data
    ctx.session.authorised
    ctx.session.user
    ctx.session.usertype
*/

app.use(home.routes())

app.use(user.routes())

app.use(restaurant.routes())

app.use(review.routes())

Handlebars.registerHelper('ifEquals', function(arg1, arg2, options) {
    if (arg1 === arg2) {
        return options.fn(this)
    } else {
        return options.inverse(this)
    }
})

app.use(router.routes())
module.exports = app.listen(port, async() => console.log(`listening on port ${port}`))

navBar.handlebars 

<div class="navBar">
    <a name="NavbarHome" href="http://localhost:8080/">Home</a>

    {{#if Authorised}}

    {{#ifEquals UserType "Admin"}}
    <a name='NavbarAddRestaurant' href="http://localhost:8080/addRestaurant">Add Restaurant</a>
    <a name='NavbarPendingReviews' href="http://localhost:8080/pendingReviews">Pending Reviews</a>
    {{/ifEquals}}

    {{#ifEquals UserType "Customer"}}
    <a name='NavbarCustomer' href="#Customer">Customer</a>
    {{/ifEquals}}

    <a name="NavbarLogout" href="http://localhost:8080/logout">Logout</a>
    {{else}}
    <a name="NavbarLogin" href="http://localhost:8080/login">Login</a>
    <a name="NavbarRegister" class="active" href="http://localhost:8080/register">Register</a>
    {{/if}}
</div>

register.handlebars 

<!doctype html>

<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Create an Account</title>
    <link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
    {{> navBar}}
    <h1>Create an Account</h1>
</body>

</html>

1 Ответ

0 голосов
/ 10 января 2020

Я нашел этот сайт, и он показывает, как правильно настроить частичное.

https://blog.fossasia.org/using-partials-in-handlebars-and-reusing-code/

...