我正在使用Node.js、Express.js、Handlebars.js和MySQL创建一个可以登录和分享歌曲的网站.我已经建立了一个LikedSong模型,它将喜欢的歌曲与喜欢它的用户关联起来,并设置允许用户喜欢一首歌并try 查看喜欢的歌曲的路由.

问题是,当触发页面查看喜欢的歌曲时,歌曲信息不会显示.

喜欢一首歌可以正确地注册到它在MySQL工作台中的表中,并且在try 将其发送到Handlebar页面之前,我的路径中喜欢的歌曲数组的console.log将返回歌曲的所有信息

点赞歌曲查看路由:

router.get("/liked", withAuth, async (req, res) => {
  try {
    const likedSongs = await LikedSong.findAll({
      where: {
        userId: req.session.user_id,
      },
      include: [Song],
    });

    // Add liked songs associated with the user to the songs array
    const songs = [];
    for (let i = 0; i < likedSongs.length; i++) {
      songs.push(await likedSongs[i].getSong());
    }
    console.log("songs =", songs);

    res.render("liked", {
      songs,
      loggedIn: req.session.loggedIn,
    });
  } catch (err) {
    console.log(err);
    res.status(500).json(err);
  }
});

=

Console.log(‘歌曲=",歌曲)结果:

songs = [
  song {
    dataValues: {
      id: 3,
      title: 'Playing God',
      artist: 'Polyphia',
      album: 'Remember That You Will Die',
      embed: '<iframe style="border-radius:12px"\n' +
        '    src="https://open.spotify.com/embed/track/3nBGFgfRQ8ujSmu5cGlZIU?utm_source=generator"\n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay;\n' +
        '    clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 1,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    _previousDataValues: {
      id: 3,
      title: 'Playing God',
      artist: 'Polyphia',
      album: 'Remember That You Will Die',
      embed: '<iframe style="border-radius:12px"\n' +
        '    src="https://open.spotify.com/embed/track/3nBGFgfRQ8ujSmu5cGlZIU?utm_source=generator"\n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay;\n' +
        '    clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 1,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    uniqno: 1,
    _changed: Set(0) {},
    _options: {
      isNewRecord: false,
      _schema: null,
      _schemaDelimiter: '',
      raw: true,
      attributes: [Array]
    },
    isNewRecord: false
  },
  song {
    dataValues: {
      id: 7,
      title: 'Solo',
      artist: 'Samsa',
      album: 'Solo',
      embed: '<iframe style="border-radius:12px"\n' +
        '    src="https://open.spotify.com/embed/track/0oinJU5psqs6JSRT1k9Wfz?utm_source=generator"\n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write;\n' +
        '    encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 2,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    _previousDataValues: {
      id: 7,
      title: 'Solo',
      artist: 'Samsa',
      album: 'Solo',
      embed: '<iframe style="border-radius:12px"\n' +
        '    src="https://open.spotify.com/embed/track/0oinJU5psqs6JSRT1k9Wfz?utm_source=generator"\n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write;\n' +
        '    encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 2,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    uniqno: 1,
    _changed: Set(0) {},
    _options: {
      isNewRecord: false,
      _schema: null,
      _schemaDelimiter: '',
      raw: true,
      attributes: [Array]
    },
    isNewRecord: false
  },
  song {
    dataValues: {
      id: 1,
      title: 'Music to Clean the House to',
      artist: 'Nick Leng',
      album: 'LEMONS',
      embed: '<iframe style="border-radius:12px" \n' +
        '    src="https://open.spotify.com/embed/track/18HzHlxWPLoJjEXJdzNf4V?utm_source=generator" \n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; \n' +
        '    encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 5,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    _previousDataValues: {
      id: 1,
      title: 'Music to Clean the House to',
      artist: 'Nick Leng',
      album: 'LEMONS',
      embed: '<iframe style="border-radius:12px" \n' +
        '    src="https://open.spotify.com/embed/track/18HzHlxWPLoJjEXJdzNf4V?utm_source=generator" \n' +
        '    width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; \n' +
        '    encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>',
      genre_id: 5,
      createdAt: 2023-08-26T20:40:08.000Z,
      updatedAt: 2023-08-26T20:40:08.000Z
    },
    uniqno: 1,
    _changed: Set(0) {},
    _options: {
      isNewRecord: false,
      _schema: null,
      _schemaDelimiter: '',
      raw: true,
      attributes: [Array]
    },
    isNewRecord: false
  }
]

=

像d.Handlebar一样:

<section class="genre">
  {{#if songs.length}}
    {{#each songs as |song|}}
      <div class="song-details">
        <h3>{{song.title}}</h3>
        <p>Album: {{song.album}}</p>
        <p>By: {{song.artist}}</p>
        {{{song.embed}}}
      </div>
    {{/each}}
  {{else}}
    <h3>No liked songs found!</h3>
  {{/if}}
</section>

=

唯一显示在Liked.Handlebar页面上的是没有试图获取歌曲信息的文本.

仅限如此

"专辑:

发信人:"

或者"找不到喜欢的歌曲!"

如果我还不喜欢一首歌的话.

感谢您能提供的任何帮助!我想解决这个问题已经有一段时间了,但没有成功,如果你需要更多的信息,请告诉我

推荐答案

我认为你可能只需要更深入地进入你的对象的另一个层次.试试这个:

如果这是您的数组:

songs = [
   {
      song: {
         dataValues: {
            id: 3,
            //...
         },
         //...
      }
   },
]

然后,您的车把将如下所示:

<section class="genre">
    {{#if songs.length}}
        {{#each songs}}
            <div class="song-details">
                <h3>{{this.song.dataValues.title}}</h3>
                <p>Album: {{this.song.dataValues.album}}</p>
                <p>By: {{this.song.dataValues.artist}}</p>
                {{{this.song.dataValues.embed}}}
            </div>
        {{/each}}
    {{else}}
        <h3>No liked songs found!</h3>
    {{/if}}
</section>

但是,如果这是您的数组:

songs = [
   {
      dataValues: {
         id: 3,
         //...
      },
      //...
   },
]

然后,您的车把将如下所示:

<section class="genre">
    {{#if songs.length}}
        {{#each songs}}
            <div class="song-details">
                <h3>{{this.dataValues.title}}</h3>
                <p>Album: {{this.dataValues.album}}</p>
                <p>By: {{this.dataValues.artist}}</p>
                {{{this.dataValues.embed}}}
            </div>
        {{/each}}
    {{else}}
        <h3>No liked songs found!</h3>
    {{/if}}
</section>

Mysql相关问答推荐

慢查询日志(log)甚至包括快速查询,因为它包括等待锁定所花费的时间

客户跨订阅的跨时间线计数

SQL-从一个字段中 Select 值,但另一个字段中不包含零值

用于将重复行的唯一列值作为单独列获取的SQL查询

如何使用GROUP BY调优简单SQL查询

运行简单查询时Prisma预准备语句错误

可以优化这个带有重复WHERE子句的查询吗?

为什么MySQL派生条件下推优化不起作用

docker-compose:无法将应用程序服务连接到 mysql 数据库,收到错误:用户‘root’@‘localhost’访问被拒绝(使用密码:YES)

在 MySQL 中使用非空条件 LAG() 函数

如何从具有第一行列值的表中 Select 客户的最新记录

MySQL 将分组 JSON Select 转换为单个 JSON 对象

mysql 执行注释部分

MySQL 查询组按日期(12 小时间隔)

MySQL 工作台与 phpMyAdmin

当您无法修复表时,如何修复 MySQL不正确的密钥文件错误?

将 Django DB 从 SQLite 迁移到 MySQL 的最佳方法是什么?

Amazon RDS Aurora 与 RDS MySQL 与 EC2 上的 MySQL?

如何在特定数据库中创建表?

如何在 MYSQL 中使用 SQL 在两个日期时间值之间减go 并以分钟或秒为单位检索结果?