将选定对象之后的所有对象推入数组答案

【问题标题】：Push all objects after a selected object into an array将选定对象之后的所有对象推入数组
【发布时间】：2023-02-14 19:17:31
【问题描述】：

我有一个返回对象列表的网页，例如：

date.pdf
names.csv
address.pdf
age.csv
cost.csv
budget.csv
data.pdf
race.pdf
contractors.csv

当用户检查budget.csv 时，我希望从该点开始将扩展名为.csv 的每个对象都推入csv_files[]。如果他们选择names.csv，那么每个.csv包括names之后都会被推入数组。

因此，唯一被推入数组的数据是从所选对象向下的。我该如何实施？

当前代码

const csv_files = []

 $scope.listAllobjects = (err, data) => {

    $.each(data.Contents, (index, value) => {
      if (value.Key.endsWith("csv")) {
        csv_files = [];
}

 // Handle click on selection checkbox
  $("#filesobjects-table tbody").on("click", 'input[type="checkbox"]', (e1) => {
    const checkbox = e1.currentTarget;
    const $row = $(checkbox).closest("tr");
    const data = $tb.DataTable().row($row).data();
    let index = -1;

    // Prevent click event from propagating to parent
    e1.stopPropagation();

    // Find matching key in currently checked rows
    index = $scope.view.keys_selected.findIndex((e2) => e2.Key === data.Key);

    if (checkbox.checked && data.Key.endsWith("csv")) {
     console.log(selected csv)
    }
  });
}

【问题讨论】：

标签： javascript arrays angular javascript-objects

【解决方案1】：

我想有几种方法可以解决这个问题，但对我来说最直观的是：

const csvList = ["date.pdf","names.csv","address.pdf","age.csv","cost.csv","budget.csv","data.pdf","race.pdf","contractors.csv"];
const selectedCsv = 'budget.csv';

function getCsvsAfter(csvList, selectedCsv) {
    const filteredCsvs = [];
    let found = false;
    for (let csv of csvList) {
    if (csv === selectedCsv) found = true;
        if (found) filteredCsvs.push(csv);
    }
    return filteredCsvs;
}

console.log(getCsvsAfter(csvList, selectedCsv));

遍历每个 csv，当您找到您要匹配的那个时，将名为 found 的变量设置为 true。一旦为真，您可以将以下每个 csv 添加到列表中。

【讨论】：

【解决方案2】：

const list = ['date.pdf','names.csv','address.pdf','age.csv','cost.csv','budget.csv','data.pdf','race.pdf','contractors.csv'];
const selected = 'budget.csv'

const csv_files = list.slice(list.indexOf(selected))

console.log(csv_files)

【讨论】：

【解决方案3】：

在这里，您使用纯 JavaScript 解决方案（在下面的代码 sn-p 中添加了描述性 cmets）。

var contentData = ["date.pdf", "names.csv", "address.pdf", "age.csv", "cost.csv", "budget.csv", "data.pdf", "race.pdf", "contractors.csv"];

var myDiv = document.getElementById("cboxes");

for (var i = 0; i < contentData.length; i++) {
  var checkBox = document.createElement("input");
  var label = document.createElement("label");
  checkBox.type = "checkbox";
  checkBox.value = contentData[i];
  myDiv.appendChild(checkBox);
  myDiv.appendChild(label);
  label.appendChild(document.createTextNode(contentData[i]));
}

// Event to handle the checkbox click
document.getElementById('getResult').addEventListener('click', () => {
  document.getElementById('showResult').innerHTML = getCheckedValues();
});

function getCheckedValues() {
  // filtered out the checked items.
  const element = Array.from(document.querySelectorAll('input[type="checkbox"]'))
  .filter((checkbox) => checkbox.checked).map((checkbox) => checkbox.value);
  
  // element[0] will always return the first checked element and then we are getting index of that.
  const checkedElemIndex = contentData.indexOf(element[0]);
  
  // Slice the content data to get the elements from the checked element index.
  return contentData.slice(checkedElemIndex, contentData.length)
}

<div id="cboxes"></div>

<button id="getResult">Get Result</button>

<pre id="showResult"></pre>

【讨论】：