Как опубликовать данные в том же e js представлении или частично после использования res.render get? - PullRequest
Новая
       5

Как опубликовать данные в том же e js представлении или частично после использования res.render get?

0 голосов
/ 12 февраля 2020

Мне нужно отобразить данные, которые публикуются после рендеринга, с помощью res.render () в get. Когда я использую <% date%>, мое представление выдает ошибку, говоря, что дата не определена, и я знаю, что это происходит, потому что мое значение не существует до рендеринга представления и его получения после. Так как мне настроить отображение этой переменной в моем файле e js до или после отображения моего представления?

Я пробовал несколько вещей, таких как использование res.send () использование другого get () внутри моего post () и даже создание частичного представления, но ничего не работает. Я не хочу нажимать какие-либо кнопки, чтобы иметь возможность сделать это , и если это возможно только при нажатии, тогда хорошо. Я знаю, вы не можете использовать res.send () в одном и том же представлении дважды .

Мой пост XMLHttpRequest выполняется, когда страница загружается в javascript, чтобы установить мою переменную даты и отправить ее в мой node.js файл, тогда я использую express, чтобы получить его. Мой node.js код следующий: 

app.get('/', function (req, res) {

    res.render('index', {
        time: time,
        views: visitors,
        mobileViews: mobileVisitors,
    });
}

app.post('/', function(req, res){
    console.log('working');

    getInfo = req.body;

    console.log(getInfo);

    //getInfo.date = 1

    res.render('index', {dataTest: getInfo.date}); //this doesnt work

    //OR res.send({dataTest: getInfo.date}); doesnt work

    //OR app.get('/', function (req, res) {res.render ... doesnt work
}

Мой e js вид: 

<h1 class="test">test <%= dataTest %></h1>

Мой js файл: 

var waitForEl = function (selector, callback) {
    if (jQuery(selector).length) {
        callback();
    } else {
        setTimeout(function () {
            waitForEl(selector, callback);
        }, 100);
    }
};

waitForEl(".daterangepicker", function () {

    var element = document.querySelector('.ranges ul').childNodes[0].childNodes[0].data.toString();

    console.log(element);

    var date = 0;
    date = sendData(date, element);

    var obj = JSON.stringify({date: date});

    console.log(obj);

    var xhr = new XMLHttpRequest();

    xhr.open("POST", "http://localhost:4000", true);
    xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");

    xhr.send(obj);
});

function sendData(date, element) {


    if(element == 'Today') {

        date = 1;
    }

    return date;
}

Ответы [ 2 ]

0 голосов
/ 12 февраля 2020

То, что я вижу, это первый раз, когда вы пытаетесь получить "/", у вас нет getInfo.date

Так что сделайте getInfo.date = Date.now()

или getInfo.date = new Date()

И передайте его в свой начальный вызов get ('/').

const bodyParser =require('body-parser'); const urlencodedParser = bodyParser.urlencoded({ extended: false }); app.get('/', function (req, res) { res.render('index', { time: time, Views: visitors, mobileViews: mobileVisitors, getinfo: getInfo}); } app.post('/',urlencodedParser,function(req, res){ console.log('working'); getInfo = req.body; console.log(getInfo); res.render('index', {getInfo: getInfo}); }.

с другой стороны, вы также можете выбрать getInfo.date = null или getInfo.date = ''

И отметьте свой e js с условием if(getinfo.date){<=getinfo.date>}

Попытка с мобильного телефона. Надеюсь, это решит

0 голосов
/ 12 февраля 2020

попробуйте это: 

const bodyParser =require('body-parser');
const urlencodedParser = bodyParser.urlencoded({ extended: false });
app.get('/', function (req, res) {

    res.render('index', {
        time: time,
        Views: visitors,
        mobileViews: mobileVisitors,
    });
}

app.post('/',urlencodedParser,function(req, res){
    console.log('working');

    getInfo = req.body;

    console.log(getInfo);

    res.render('index', {getInfo: getInfo});

}

вам также понадобится промежуточное программное обеспечение для обработки метода post в express app 

npm i body-parser

лучше использовать имя ключа объекта в качестве имени его значения чтобы упростить циклическое переключение по свойствам

, тогда в вашем представлении e js используйте: 

<%= getInfo.date %>

есть знак = , не забывайте его.

...