Найти совпадения между двумя массивами в EJS - PullRequest
0 голосов
/ 06 апреля 2020

Я использую узел, express, knex, postgres, E JS и bootstrap. У меня есть одна таблица, deckorderfil, в которой есть столбец первичного ключа ordnbr. Моя другая таблица, decktowfil, имеет внешний ключ ordnbr, ссылающийся на deckorderfil.

Моя проблема, с которой я сталкиваюсь, заключается в том, что у меня не получается получить E JS для печати только тех результатов decktowfil, которые соответствуют deckorderfil.

Я успешно выяснил, как отобразить оба результата после выполнения запроса GET к URL-адресу, выполнив следующие действия:

Мой индекс. js route:

router.get('/dashboard', authMiddleware.ensureLoggedIn, function(req, res) {
  Tow.getTows().then(tows => {
    Job.getJobs().then(jobs => {
    jobs = JSON.parse(JSON.stringify(jobs)); //deckorderfil table
    tows = JSON.parse(JSON.stringify(tows)); //decktowfil table
    res.render('dashboard', { title: 'Express', jobs: jobs, tows: tows });
  });
    });
});

my dashboard.e js:

<% for (let i = 0; i < jobs.length; i++) { %> <!-- deckorderfil (primary key) table -->
  <%= jobs[i].ordnbr %>
  <% } %>

<% for (let j = 0; j < tows.length; j++) { %> <!-- decktowfil (foreign key) table -->
    <%= tows[j].ordnbr %>

  <% } %>

dashboard.e js печатает следующее:

D1 D2 D3 (the jobs ordnbr's) D1 D1 D2 (the tows ordnbr's)

Мой вопрос: как мне создать оператор IF в котором говорится: «если задание ordnbr - D1, вернуть только буксиры ordnbr, которые также равны D1, и создать div для каждого из них»?

Я уже преуспел в зацикливании моего E JS для получения div которые показывают каждый идентификатор deckorderfil и его другие переменные. Я пытаюсь встроить соответствующие записи decktowfil в эти элементы как их отдельные элементы. Вот изображение того, что я пытаюсь выполнить sh.

enter image description here

Должен ли я сделать это с помощью Knex, E JS или jquery / javascript? И если да, то где и в какой момент? До сих пор я пытался установить идентификатор родительского элемента в моем HTML для deckorderfil ordnbr, а затем сопоставить мой запрос E JS с этим, но он не сработал.

Спасибо и пожалуйста дайте мне знать, если вам нужно что-то еще, чтобы ответить на вопрос.

Ответы [ 2 ]

0 голосов
/ 06 апреля 2020

Хорошо, я получил его на работу. Все дело в том, чтобы попытаться выяснить, как вложить циклы for и получить правильные элементы div.

Вот как я построил свой E JS, чтобы получить правильный вывод. Мне не нужно было использовать оператор .find ().

<% for (let i = 0; i < jobs.length; i++) { %>
    <div class="outer">
    <p>Jobs <%= jobs[i].ordnbr %></p>
    <% for (let j = 0; j < tows.length; j++) { %>
        <% if (tows[j].ordnbr === jobs[i].ordnbr) { %>
            <div class="inner">
                <p>Tow: <%= tows[j].tow_id %></p>
            </div>
        <% } %>
        <% } %>
    </div>
    <% } %>

Спасибо, Дэниел, за помощь. Вы зажгли мою изобретательность.

0 голосов
/ 06 апреля 2020

Не зная точной формы объектов, вот способ реализовать это, которое будет работать:

Express приложение

const jobs = [
  {
    orderNum: 'D1'
  },
  {
    orderNum: 'D2'
  },
  {
    orderNum: 'D3'
  },
];

const tows = [
  {
    orderNum: 'D1',
    orders: [
      1,
      2,
      3,
    ],
  },
  {
    orderNum: 'D2',
    orders: [
      1,
      2,
      3,
    ],
  },
  {
    orderNum: 'D3',
    orders: [
      1,
      2,
      3,
    ],
  },
];

app.get('/', (req, res, next) => {
  res.render('index', { jobs, tows });
});

Index.e js*

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <style type="text/css">
      .outer {
        border: 1px solid red;
        padding: 18px;
        margin: 12px;
      }
      .inner {
        margin: 12px;
        padding: 12px;
        border: 1px solid green;
      }
    </style>
  </head>
  <body>

    <% for (let i = 0; i < jobs.length; i++) { %>
      <div class="outer">      
        <p>Jobs<%= jobs[i].orderNum %></p>
          <% tows.find(tow => tow.orderNum === jobs[i].orderNum).orders.forEach(order => { %>
          <div class="inner">

            <p>Tows: id <%= order %></p>

          </div>
          <% }); %>
      </div>
    <% } %>
  </body>
</html>

Результат:

enter image description here

...