Handlebars if 語句條件顯示基於membershipID的內容

Question

有關數據庫的快速詳細信息

我有引用成員資格表的用戶表。

這是一些示例數據

userID   username   membershipID
  1        test          1    -- Admin
  2        test2         2    -- Standard

當前車把

我已經設置了車把頁面

{{#if user}}
<li class="nav-item">
  <a class="nav-link" href="/admin">Admin</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="/about">About Us</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="#">Contact Us</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="/logout">Logout</a>
</li>

{{else}}

<li class="nav-item">
  <a class="nav-link" href="/admin">Admin</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="/register">Register</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="/login">Login</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="/about">About Us</a>
</li>
<li class="nav-item">
  <a class="nav-link" href="#">Contact Us</a>
</li>

{{/if}}

上述代碼的詳細信息

當用戶登錄時，它會顯示相關的導航項目。

問題

我可以在用戶的成員 ID 的句柄欄中獲得 output，例如：

{{user.membershipID}}

會給我一個 1 或 2 的 output。然后如何在車把中創建一個 if 語句來確定要顯示的內容？

還是有替代方法？ 如果需要，我可以向您展示我的所有代碼嗎？

任何幫助表示贊賞！

編輯 1

我正在嘗試測試車把寄存器：

項目/helpers/handlebars-helper.js

module.exports = {


  membership: ("ifEqual", function(variable1,variable2,options){
    if (variable1 === variable2) {
    return options.fn(this);
  } else {
    return options.inverse(this);
  }
 })

}

項目/app.js

const handlebars = require('express-handlebars');

// Public directory static file
app.use(express.static(path.join(__dirname, '/public')));

// View engine
const {membership} = require('./helpers/handlebars-helpers');

app.engine('handlebars', handlebars({defaultLayout: 'home', helpers: {membership: membership}}));

app.set('view engine', 'handlebars');

項目/視圖/partials/home/home-nav.handlebars

{{#membership}}
{{#ifEqual 1 1}}
<h1>Test</h1>
{{/ifEqual}}
{{/membership}}

詳細信息和 output

在這里，我看到 1 是否等於 1，如果是，則顯示h1 output。 但我得到這個錯誤：

TypeError: Cannot read property 'inverse' of undefined

編輯2：

這是我現在的位置

項目/helpers/handlebars-helpers.js

const handlebars = require('express-handlebars');

module.exports = {

  membership: handlebars.create('ifEquals', function(arg1, arg2, options) {
    return (arg1 == arg2) ? options.fn(this) : options.inverse(this);
})


}

項目/視圖/partials/home/home-nav.handleabrs

{{#membership}}
{{#ifEqual 2 2}}
  <h1>Test</h1>
{{/ifEqual}}
{{/membership}}

Output 上 HTML

[object Object]

Answer 1

終於想通了！

項目/app.js

// View engine

const {membership} = require('./helpers/handlebars-helpers');

app.engine('handlebars', handlebars({defaultLayout: 'home', helpers: {membership: membership}}));

app.set('view engine', 'handlebars');

項目/helpers/handlebars-helper.js

module.exports = {

  membership: function(var1, var2, options){
    if(var1 === var2) {
    return options.fn(this);
  }
  return options.inverse(this);
  }
}

最后在.handlebars中：

{{#membership 1 5}}
<p>True</p>
{{/membership}}

Answer 2

您可以定義自定義輔助函數來檢查 2 個變量是否相等並采取相應措施。 以下是如何定義自定義助手：

  const hbs = require("hbs");
  
  hbs.registerHelper("ifEqual", function (variable1,variable2,options){
    if (variable1 === variable2) {
      return options.fn(this);
    }
    return options.inverse(this);
  });

以下是您從 hbs 視圖中調用它的方式：

  {{#ifEqual variable1 variable2}}
    //code
  {{else}}
    //code
  {{/ifEqual}}

舉例說明：

最少的后端代碼：

const express = require("express");
const app = express();

const hbs = require("hbs");

app.set('view engine', 'hbs');


app.listen(3000)
hbs.registerHelper("ifEqual", function (variable1,variable2,options){
  if (variable1 === variable2) {
    return options.fn(this);
  }
  return options.inverse(this);
});

app.get("/", (req, res) => {
  return res.render("test.hbs", {user:{id:1}})
});

最少的前端代碼：

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    {{#ifEqual user.id 2}}
        <p>"User Id: "{{user.id}} "is equal to 2"</p>
    {{else}}
      <p>"User Id: "{{user.id}} "is not equal to 2"</p>
    {{/ifEqual}}
</body>
</html>

Handlebars if 語句條件顯示基於membershipID的內容

問題描述

2 個解決方案

解決方案1
3 已采納 2020-07-31 08:14:00

解決方案2
2 2020-07-26 17:09:09

Handlebars if 語句條件顯示基於membershipID的內容

問題描述

2 個解決方案

解決方案1 3 已采納 2020-07-31 08:14:00

解決方案2 2 2020-07-26 17:09:09

解決方案1
3 已采納 2020-07-31 08:14:00

解決方案2
2 2020-07-26 17:09:09