Как обновить ссылки с общим заголовочным файлом, используя javascript или nodejs - PullRequest
Новая
       5

Как обновить ссылки с общим заголовочным файлом, используя javascript или nodejs

1 голос
/ 24 июня 2019

Я хотел бы знать, как обновить ссылки для всех страниц.

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

, когда выбирается выпадающий список На странице индекса, URL-адрес выпадающего меню должен быть /en``/th, Вкл. Остраница, раскрывающийся URL-адрес должен быть /en/about /th/about На странице контактов раскрывающийся URL-адрес должен быть /en/contact, th/about

, поэтому мой вопрос заключается в том, что у меня общий заголовок, когда я перехожу на соответствующие страницыКак мне обновить ссылки в выпадающем URL.Как это сделать, используя интерфейс / бэкэнд, немного запутанный 

//language.js
var express = require('express');
var router = express.Router();
router.get('/', function (req, res) {
    res.render('index.ejs'});
});
module.exports = router;
//aboutus.js
var express = require('express');
var router = express.Router();
router.get('/', function (req, res) {
    res.render('aboutus.ejs');
});
module.exports = router;


header.ejs

<body>
  <nav>
  <ul>
 <li class="nav-item">
            <a class="nav-link" href="/en/about" style="margin-right: 1.5rem!important;">about us</a>
          </li>
          <li class=" nav-item">
            <a class="nav-link" href="/en/contact"
              style="margin-right: 1.5rem!important;">contact us</a>
          </li>
  </ul>
    <div class="dropdown">
      <button id="language" class="btn btn-warning dropdown-toggle" type="button" id="dropdownMenu2"
        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="clickButton()">
        English
      </button>
      <div id="languagelist" class="dropdown-menu" aria-labelledby="dropdownMenu2" onclick="clickItem(); return false">
        <a class="dropdown-item" href="/en">English</a> //change this link according to the page
        <a class="dropdown-item" href="/th">Thai</a>//change this link according to the page
      </div>
    </div>
  </nav>
</body>

//index.ejs

  <%- include header.ejs %>
  <h1>Welcome to My Site</h1>
//about.ejs

  <%- include header.ejs %>
  <h1>About us</h1>

1 Ответ

0 голосов
/ 24 июня 2019 
 <div id="languagelist" class="dropdown-menu" aria-labelledby="dropdownMenu2" onclick="clickItem(); return false">
    <a class="dropdown-item" href="javascript:" onclick="updateLang("en")">English</a> //change this link according to the page
    <a class="dropdown-item" href="javascript:" onclick="updateLang("th")">Thai</a>//change this link according to the page
  </div>

Script for the updatelang
updateLang(val){
 var url = new URL(location.href);
 var query_string = url.search;
 var search_params = new URLSearchParams(query_string); 

 // new value of "lang" is set to "th" val = "th"
 search_params.set('lang', val);

 // change the search property of the main url
 url.search = search_params.toString();

 // the new url string
 var new_url = url.toString();

 // output : http://demourl.com/path?lang=th
 console.log(new_url);
 location.replace(new_url)
}


you can send query parameter to backend
router.get('/', function (req, res) {
   let lang = req.query.lang;
// based on lang you can send file
   res.render('aboutus.ejs');
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...