Einfacher express aufbau und pug-engine

  • this hat gar nichts damit zu tun. Das ist eher ein Timingproblem. Da es asynchron ist, wird das .then erst nach dem console.log aufgerufen.

    Du müsstest den Ablauf anders organisieren.

    Entweder

    JavaScript-Quellcode

    1. app.get('/vokabelnabfragen', function (req, res) {
    2. var sitename = 'vokabelnabfragen'
    3. selectvok()
    4. .then( results => {
    5. console.log(results)
    6. return buildsite(res, sitename, content)
    7. })
    8. .then(console.log(`Die ${sitename} wurde erstellt`))
    9. .catch( err => console.log(err) )
    10. })

    oder evtl

    JavaScript-Quellcode

    1. app.get('/vokabelnabfragen', async (req, res) => {
    2. try {
    3. const sitename = 'vokabelnabfragen'
    4. const results = await selectvok()
    5. console.log(results)
    6. await buildsite(res, sitename, content)
    7. console.log(`Die ${sitename} wurde erstellt`)
    8. } catch(err) {
    9. console.log(err)
    10. }
    11. })
    Alles anzeigen
  • Ja, jetzt wo du es sagst sehe ich es auch. Auch dass selectvok() result ja returned und deshalb in einer Variabel abgefangen werden kann/muss. Irgendwie habe ich das Asynchrone noch nicht auf der Platte...

    JavaScript-Quellcode

    1. app.get('/vokabelnabfragen', async function (req, res) {
    2. var sitename = 'vokabelnabfragen'
    3. var resultsvok = await selectvok()
    4. .catch( err => console.log(err) )
    5. console.log(resultsvok)
    6. await buildsite(res, sitename, content)
    7. .then(console.log(`Die ${sitename} wurde erstellt`))
    8. .catch(err => console.log(err))
    9. })
    Danke. Was meintest du eigentlich genau mit Plain Text bei Pug?
  • Also ich muss ja sagen dass JSON-Objekte und pug mir immer sympathischer werden...

    JavaScript-Quellcode: Teil von /app.js

    1. var content = {
    2. sitetitle: 'Vokabeltrainer-0.1',
    3. title: 'Vokabeltrainer'
    4. }
    5. .
    6. .
    7. .
    8. app.get('/vokabelnabfragen', async function (req, res) {
    9. var sitename = 'vokabelnabfragen'
    10. content.data = await selectvok()
    11. .catch(err => { throw err })
    12. await buildsite(res, sitename, content)
    13. .then(console.log(`Die ${sitename} wurde erstellt`))
    14. .catch(err => { throw err })
    15. })
    Alles anzeigen

    JavaScript-Quellcode: /views/vokabelnabfragen.pug

    1. extends layout
    2. block content
    3. h1=title
    4. p
    5. a(href='/') Zurück
    6. p
    7. | Insgesamt haben Sie bisher #{data.length} Vokabeln
    8. br
    9. | die Sie abfragen können.
    10. ul
    11. each val in data
    12. li=val.vokabel_english+' = '+val.vokabel_deutsch
    Alles anzeigen
  • Ich wollte auf der Seite vokabelnabfragen jede Vokabel, in einer Form, mit einer checkbox ausgeben lassen und dann per submit die Liste der Vokabeln die abgefragt werden sollen schicken aber ich bekomme nur undefined bei req.params... was mach ich falsch?

    JavaScript-Quellcode: /app.js

    1. const express = require('express')
    2. const path = require('path')
    3. const bodyParser = require('body-parser')
    4. const { insertvok, selectvok } = require(path.join(__dirname, 'module', 'mysql'))
    5. var app = express()
    6. app.use(bodyParser.json())
    7. app.use(bodyParser.urlencoded({ extended: false }))
    8. app.use(express.static('public'))
    9. app.set('view engine', 'pug')
    10. app.set('views', path.join(__dirname, 'views'))
    11. var content = {
    12. sitetitle: 'Vokabeltrainer-0.1',
    13. title: 'Vokabeltrainer'
    14. }
    15. // '/:sitename' and req.params.sitename to get URL Parameters
    16. app.get('/', function (req, res) {
    17. var sitename = 'startseite'
    18. buildsite(res, sitename, content)
    19. .then(console.log(`Die ${sitename} wurde erstellt`))
    20. .catch(err => { throw err })
    21. })
    22. app.get('/neuevokabel', function (req, res) {
    23. var sitename = 'neuevokabel'
    24. buildsite(res, sitename, content)
    25. .then(console.log(`Die ${sitename} wurde erstellt`))
    26. .catch(err => { throw err })
    27. })
    28. app.get('/neuevokabel/eintragen', function (req, res) {
    29. var sitename = 'neuevokabel'
    30. //console.log(req.param('nvok'))
    31. insertvok(req.param('nvok'), req.param('bed'))
    32. buildsite(res, sitename, content)
    33. .then(console.log(`Die ${sitename} wurde erstellt`))
    34. .catch(err => { throw err })
    35. })
    36. app.get('/vokabelnabfragen', async function (req, res) {
    37. var sitename = 'vokabelnabfragen'
    38. content.data = await selectvok()
    39. .catch(err => { throw err })
    40. await buildsite(res, sitename, content)
    41. .then(console.log(`Die ${sitename} wurde erstellt`))
    42. .catch(err => { throw err })
    43. })
    44. app.post('/vokabelnabfragen/auswahl', async function (req, res) {
    45. var sitename = 'vokabelnabfragen'
    46. console.log(req.params[0])
    47. /*await buildsite(res, sitename, content)
    48. .then(console.log(`Die ${sitename} wurde erstellt`))
    49. .catch(err => { throw err })*/
    50. })
    51. function buildsite(res, sitename, content){
    52. return new Promise( resolve => res.render(sitename, content))
    53. }
    54. app.listen(4200)
    Alles anzeigen


    JavaScript-Quellcode: /views/vokabelnabfragen.pug

    1. extends layout
    2. block content
    3. h1=title
    4. p
    5. a(href='/') Zurück
    6. p
    7. | Insgesamt haben Sie bisher #{data.length} Vokablen
    8. br
    9. | die Sie abfragen können.
    10. ul
    11. form(action="/vokabelnabfragen/auswahl" method="post")
    12. each val, index in data
    13. .form-group
    14. li="Nr: "+(index+1)+" ID: "+ val.id +" "+val.vokabel_english+' = '+val.vokabel_deutsch
    15. input(type="checkbox" name=idex value=val.vokabel_english)
    16. button(type="submit")!='send'
    Alles anzeigen
    Die Seite sieht so aus. Wie bekomme ich die checkboxen auf die selbe Zeile mit den Vokabeln?

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von vision27 ()

  • Hab ich gemacht und ich bekomme {} wenn ich req.params ausgeben lasse.

    JavaScript-Quellcode: /views/vokabelnabfragen.pug

    1. extends layout
    2. block content
    3. h1=title
    4. p
    5. a(href='/') Zurück
    6. p
    7. | Insgesamt haben Sie bisher #{data.length} Vokablen
    8. br
    9. | die Sie abfragen können.
    10. ul
    11. form(action="/vokabelnabfragen/auswahl" method="post")
    12. each val, index in data
    13. .form-group
    14. li="Nr: "+(index+1)+" ID: "+ val.id +" "+val.vokabel_english+' = '+val.vokabel_deutsch
    15. input(type="checkbox" name=val.id value=val.vokabel_english)
    16. button(type="submit")!='send'
    Alles anzeigen

    JavaScript-Quellcode: /app.js

    1. const express = require('express')
    2. const path = require('path')
    3. const bodyParser = require('body-parser')
    4. const { insertvok, selectvok } = require(path.join(__dirname, 'module', 'mysql'))
    5. var app = express()
    6. app.use(bodyParser.json())
    7. app.use(bodyParser.urlencoded({ extended: false }))
    8. app.use(express.static('public'))
    9. app.set('view engine', 'pug')
    10. app.set('views', path.join(__dirname, 'views'))
    11. var content = {
    12. sitetitle: 'Vokabeltrainer-0.1',
    13. title: 'Vokabeltrainer'
    14. }
    15. // '/:sitename' and req.params.sitename to get URL Parameters
    16. app.get('/', function (req, res) {
    17. var sitename = 'startseite'
    18. buildsite(res, sitename, content)
    19. .then(console.log(`Die ${sitename} wurde erstellt`))
    20. .catch(err => { throw err })
    21. })
    22. app.get('/neuevokabel', function (req, res) {
    23. var sitename = 'neuevokabel'
    24. buildsite(res, sitename, content)
    25. .then(console.log(`Die ${sitename} wurde erstellt`))
    26. .catch(err => { throw err })
    27. })
    28. app.get('/neuevokabel/eintragen', function (req, res) {
    29. var sitename = 'neuevokabel'
    30. //console.log(req.param('nvok'))
    31. insertvok(req.param('nvok'), req.param('bed'))
    32. buildsite(res, sitename, content)
    33. .then(console.log(`Die ${sitename} wurde erstellt`))
    34. .catch(err => { throw err })
    35. })
    36. app.get('/vokabelnabfragen', async function (req, res) {
    37. var sitename = 'vokabelnabfragen'
    38. content.data = await selectvok()
    39. .catch(err => { throw err })
    40. await buildsite(res, sitename, content)
    41. .then(console.log(`Die ${sitename} wurde erstellt`))
    42. .catch(err => { throw err })
    43. })
    44. app.post('/vokabelnabfragen/auswahl', async function (req, res) {
    45. var sitename = 'vokabelnabfragen'
    46. console.log(req.params)
    47. /*await buildsite(res, sitename, content)
    48. .then(console.log(`Die ${sitename} wurde erstellt`))
    49. .catch(err => { throw err })*/
    50. })
    Alles anzeigen