javascript - EJS：在填充和引用的模型中预选 html 选择选项

Question

NodeJS、Express-App、MongoDB、Mongoose：

模型：我有两个模型（在artist.js 和publication.js 中），其中一个在对象数组中引用其他模型。

控制器/路由器：我将每个模型的所有实例作为对象数组传递给视图

查看：使用EJS，我正在迭代出版物数组（填充艺术家），然后迭代艺术家数组并使用.includes()-Method来检查哪些艺术家已经被引用。我想在 if/else 语句中使用这个来获取已经引用的 Artists 作为预选选项。

但这还行不通。我想这是由于人口众多的艺术家是一组对象（“_id”：“647286347823 ...”在引号中）和一个没有引号的艺术家（_id：647286347823 ...）

const mongoose =  require('mongoose')

const PublicationSchema = new mongoose.Schema({
  name: {
    type: String,
    required: true
  },
  artists: [{
    type: mongoose.Schema.Types.ObjectId,
    ref: 'Artist'
  }]
})

module.exports = mongoose.model('Publication', PublicationSchema)

const mongoose =  require('mongoose')

const ArtistSchema = new mongoose.Schema({
  name: {
    type: String,
    required: true
  }
})
module.exports = mongoose.model('Artist', ArtistSchema)

router.get('/', async(req, res) => {
  try {
    const artists = await Artist.find({})
    const publications = await Publication.find({}).populate('artists').exec()
    res.render('./admin/edit', {
      artists,
      publications
    })
  } catch {
  }
})

// console.log('artists: ')
// console.log(artists)
// console.log('publications: ')
// console.log(publications)

// artists: 
[
  { _id: 60eebd8c4bf48f1916b4f4d8, name: 'first artist', __v: 0 },
  { _id: 60eebd8f4bf48f1916b4f4de, name: 'second Artist', __v: 0 }
]
// publications: 
[
  {
    artists: [ [Object] ],
    _id: 60eebd944bf48f1916b4f4e4,
    name: 'first publication',
    __v: 0
  },
  {
    artists: [ [Object], [Object] ],
    _id: 60eebd994bf48f1916b4f4ea,
    name: 'second publication',
    __v: 0
  }
]

<% publications.forEach(publication => { %>
  <form action="edit/publications/<%= publication.id %>?_method=PUT" method="POST" class="">
    <label>publication artists:</label>
    <select name="publicationArtists" multiple>
      <% artists.forEach(artist => { %>
        <% if (publication.artists.includes(artist.id)) { %>
          <option selected label="<%= artist.name %>" value="<%= artist.id %>">
        <% } else { %> 
          <option label="<%= artist.name %>" value="<%= artist.id %>">
        <% } %> 
      <% }) %> 
    </select>
    <button type="submit">Update</button>
  </form>
<% }) %>

// This is what the iterations return:

// console.log(publication.artists)
// console.log(artist.id)

// publication.artists (first publication): 
[{"_id":"60eebd8c4bf48f1916b4f4d8","name":"first artist","__v":0,"createdAt":"2021-07-14T10:44:09.090Z","updatedAt":"2021-07-14T10:44:09.090Z"}]
// publication.artists (second publication): 
[{"_id":"60eebd8c4bf48f1916b4f4d8","name":"first artist","__v":0,"createdAt":"2021-07-14T10:44:09.090Z","updatedAt":"2021-07-14T10:44:09.090Z"},{"_id":"60eebd8f4bf48f1916b4f4de","name":"second Artist","__v":0,"createdAt":"2021-07-14T10:44:09.091Z","updatedAt":"2021-07-14T10:44:09.091Z"}]
// artist.id (first artist): 
60eebd8c4bf48f1916b4f4d8
// artist.id (second artist): 
60eebd8f4bf48f1916b4f4de

标签： javascripthtmlnode.jsmongooseejs