AngularJS-如何从嵌套数组中获取单个元素

AngularJS - How to get a single element from a nested array?

本文关键字：获取 单个 元素 数组 嵌套 AngularJS-      更新时间：2023-09-26

我在其他帖子中看到这个问题的答案不同，但目标似乎不同，除了一些我仍然不明白的解决方案。我需要的是，一旦你点击标题，只显示一个项目。例如：

JSON文件：

[
    {
    "section": "Certifications",
    "courses": [
      {
        "title": "Certificate 1",
        "code": "SIT10213",
        "requisite": false,
        "cost": "110",
        "duration": "5h"
      },{
        "title": "Certificate 2",
        "code": "YYX",
        "requisite": "Course X",
        "cost": "150",
        "duration": "172 hours"
      },{
        "title": "Certificate 3",
        "code": "XXY",
        "requisite": "Course Y",
        "cost": "210",
        "duration": "1 day"
      }
    ]
  },{
    "section": "Qualifications",
    "courses": [
      {
        "title": "Bar Operations",
        "code": "SXW",
        "requisite": false,
        "cost": "120",
        "duration": "97–107 hours in total"
       },
       {
        "title": "RSA",
        "code": "YZX",
        "requisite": false,
        "cost": "100",
        "duration": "97–107 hours in total"
       }
    ]
  }
]

在HTML中，我想做的是：

  1. 该应用程序列出了每个部分/类别的链接
  2. "显示所有"应该简单地列出所有
    （我还没有处理这个）
  3. 你点击该部分，它会在下面列出可用的课程。
    （直到现在，我还是设法让它发挥作用。）
  4. 用户单击课程标题，就会显示该特定课程的详细信息
    （这里是嵌套数组欺骗我的地方。有courseArray.section[pparentIndex].corse[$index].title这样的东西吗？）

以下是Plnkr版本-已启动但从未修复：http://plnkr.co/edit/JRIyQLuRfVslVjr5fFSY?p=preview

对此，我们将不胜感激。最佳，San

好的，不确定这是否是最好的方法，但它满足了我的需要。当您单击课程链接时，我已经将课程代码作为参数添加到ngClick函数中。当使用ng repeat获取课程时，我使用"filter:courseCode"只显示与上面发送的代码匹配的一个课程。希望这也能帮助其他人。干杯

相关文章：