Saya mencoba merender ulang template pug saya melalui setInterval(). Apakah ini mungkin?

Saya mencoba merender ulang template pug saya melalui setInterval().

Saya mencoba membuat halaman menampilkan data langsung dari server MySQL. Saya bisa mendapatkan data ke halaman tersebut tetapi saya tidak tahu cara memperbarui data yang ditampilkan tanpa menyegarkan seluruh halaman.

Saya telah mencoba mengimplementasikan AJAX dan juga mencoba melakukannya melalui socket.io tetapi gagal mengirim data ke template pug pada kedua upaya tersebut.

Server.js

var express = require('express');
var app = express();
var http = require('http');
var server = http.createServer(app);
var pug = require('pug');
var io = require('socket.io').listen(server);
var clients = [];
var outsideData = require('./public/data.js');

app.set('views', __dirname + '/views');
app.set('view engine', 'pug');
app.use(express.static(__dirname + '/public'));

app.get('/', function(req, res) {
    res.render('index.pug', {
        data: outsideData.getData()
    });
});

io.sockets.on('connect', function() {
    clients.push(io.sockets);
    console.log("connected");
});

//Recompile Pug Template
function recompile() {
    var pug = require('pug');
    var template = require('fs').readFileSync('./views/index.pug', 'utf8');
    var pugFn = pug.compile(template, {
        filename: './views/index.pug',
        pretty: true
    });
    var renderedTemplate = pugFn({
        data: outsideData.getData()
    });
}

//Send data every second.
setInterval(function() {
    for (i = 0; i < clients.length; i++) {
        recompile();
        clients[i].emit('data', outsideData.getData());
    }
}, 30000);

//Handle diconnected clients.
io.sockets.on('disconnect', function() {
    var index = clients.indexOf(io.socket);
    if (index != -1) {
        clients.splice(index, 1);
    }
});

server.listen(3001);

indeks.pug

doctype html
html
    head
        title Socket Communication
         script(src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js')
        script(src="/socket.io/socket.io.js")
        //script(src="client.js")
        var socket = io.connect();
        socket.on('data', function(data) {
            var myData = $('myData');
            console.log(data)
        });
    body
        h1= "Help me..."
        p= JSON.stringify(data)

Pembaruan: Berikut adalah perubahan yang berhasil. Terima kasih mk12ok.

Server.js

var express = require('express');
var app = express();
var http = require('http');
var server = http.createServer(app);
var pug = require('pug');
var io = require('socket.io').listen(server);
var clients = [];
var outsideData = require('./public/data.js');

app.set('views', __dirname + '/views');
app.set('view engine', 'pug');
app.use(express.static(__dirname + '/public'));

app.get('/', function(req, res) {
    res.render('index.pug');
});

io.sockets.on('connect', function() {
    clients.push(io.sockets);
    console.log("connected");
});

//Send data every second.
setInterval(function() {
    for (i = 0; i < clients.length; i++) {
        clients[i].emit('data', outsideData.getData());
    }
}, 1000);

//Handle diconnected clients.
io.sockets.on('disconnect', function() {
    var index = clients.indexOf(io.socket);
    if (index != -1) {
        clients.splice(index, 1);
    }
});

server.listen(3001);

indeks.pug

doctype html
html
    head
        title Socket Communication
        script(src="/socket.io/socket.io.js")
        //script(src="client.js")
    body
        h1= "Help me..."
        p(id="data")
        script.
            var socket = io.connect();
            socket.on('data', function(data) {
                //Replace JSON.stringify(data) with JSON.stringify(data.tag) to retrieve a specific value stored in your JSON data.
                document.getElementById("data").innerHTML = "Received" +    JSON.stringify(data);
                console.log(data)
            });