数组中的JavaScript数组_Javascript_Angularjs

数组中的JavaScript数组

javascript angularjs

数组中的JavaScript数组,javascript,angularjs,Javascript,Angularjs,我想在“locationsList”上放置一个数组。下面的示例输出 "['Location 1', 'Location 2', 'Location 3']" 用括号和所有东西我错过了什么 App.controller('locationAccordionCtrl', function ($scope) { $scope.locations = [ { "siteName":"First Site", "siteID":"First ID",

我想在“locationsList”上放置一个数组。下面的示例输出

"['Location 1', 'Location 2', 'Location 3']"

用括号和所有东西

我错过了什么

App.controller('locationAccordionCtrl', function ($scope) {

  $scope.locations = [
    {
      "siteName":"First Site",
      "siteID":"First ID",
      "locationCount":"200 Locations",
      "locationsList":['Location 1', 'Location 2', 'Location 3'],
      "open":false
    }
  ];

});

这就是我的HTML的外观：

代码：

我想要的是列出所有位置（带换行符）。例如：

实际上，嵌套数组是正确的

使用chrome F-12进入控制台并复制+粘贴，您将看到您做得正确：

我的例子是： foobar={something:“else”，“foobar”：“yes”，“delta”：[“hello”，“world”]}

也许您的问题在于jquery中的回调，我觉得您正在尝试绘制

{{locations.locationsList}}

locationsList是一个数组，要单独绘制，需要使用ng repeat

<div ng-repeat="location in locations.locationsList">{{location}}</div>

{{location}

仅供参考-

假设您的HTML如下所示：

<html>
  ...
  <div ng-controller="locationAccordionController">
  </div>
  ...
</html>


...
...

要获得所需的输出，您需要使用迭代数组并为每个数组构造一个DOM元素（例如a

）：

...
{{location.locationCount}


{{innerLocation}}


...

更新：注意跟踪$index
；这是因为Angular需要一种方法将那些创建的DOM元素链接到$scope
中的模型，如果数组中有重复的字符串，Angular（或JavaScript）就无法区分它们。因此，我们使用数组中的位置（$index
）作为每个元素的唯一标识符，以防重复
您可以设置列表项的样式，使其不包含项目符号（例如，如果使用引导），或者您可以将其设置为
s而不是列表。
您的“输出”代码是什么？如果它输出整个数组，则问题在于执行输出的代码。也显示视图。因此，您有一个数组，其中包含一个对象作为其唯一的数组成员。此对象有多个属性，其中一个属性的值为数组。这对您来说很清楚？要访问locationsList中的数组成员，您必须使用通常的语法：$scope.locations[0]。例如，locationsList[0]将为您提供“Location 1”。您是否将{{locations.locationsList}}
放在视图中的某个位置，并期望数组的字符串表示以外的其他内容？如果要迭代这些值并从每个值（例如，位置1）构建DOM的一部分，请使用。如果试图构造不带括号的字符串，请使用{{locations.locationsList.join（'，'）}
。如果是其他内容，请提供更多信息。不要在嵌套数组周围使用引号。OP从未提到过jquery。这是一个有角度的问题，OP很可能只是将{{{locations.locationsList}}
放在他们的视图中，并希望得到字符串以外的输出。谢谢，这很有效。我不明白如何访问嵌套的locationList。没问题@simple。我更新了答案，加入了跟踪$index
，并解释了原因。这是一个很好的实践，当您在原语上迭代时&数组中可能存在重复值（即使没有这种可能性，也不会有任何影响）。如何使我的内部位置仅对每个实例进行“索引”？能否使用更完整的$scope.locations
示例更新您的问题，该示例还显示了您所说的多个位置列表的含义？我创建了另一个问题。
{{locations.locationsList}}

<div ng-repeat="location in locations.locationsList">{{location}}</div>

<html>
  ...
  <div ng-controller="locationAccordionController">
  </div>
  ...
</html>

<html>
  ...
  <div ng-controller="locationAccordionController">
    <div ng-repeat="location in locations">
      <p>{{location.locationCount}}</p>
      <ul>
        <li ng-repeat="innerLocation in location.locationsList track by $index">
          {{innerLocation}}
        </li>
      </ul>
    </div>
  </div>
  ...
</html>