Angular forEach返回第一個字母而不是整個單詞

Question

我有一個簡單的angular函數，可從JSON對象獲取category屬性並返回每個唯一值。 但是，當我通過這些值進行ng-repeat時，我只會得到第一個字母，而不是單詞。 我敢肯定，這只是我對Java腳本的一些小誤解，但是任何幫助都會很棒。 除了下面我粘貼的內容外，請參考我的CodePen

Angular JS：

angular.module('app', ['ngAnimate'])

.controller('starWarsCtrl', function ($scope) {
  $scope.data = [
    {"name": "Obi-Wan Kenobi",
     "index":88,
      "cat": "jedi"},
    {"name": "Yoda",
     "index":69,
      "cat":"jedi"},
    {"name": "Lando",
     "index":31,
      "cat": "smuggler"},
    {"name": "Han Solo",
     "index":90,
      "cat": "smuggler"},
    {"name": "Darth Vader",
     "index":98,
      "cat": "sith"},
    {"name": "Jar-Jar Binks",
     "index":80,
      "cat": "alien"},
    {"name": "Mace Windu",
     "index":45,
      "cat": "jedi"},
    {"name": "Chewy",
     "index":76,
      "cat": "smuggler"}
  ];

  $scope.getCategories = function() {
    var categories = [];

     angular.forEach($scope.data, function(item) {
      angular.forEach(item.cat, function(category) {
        if (categories.indexOf(category) == -1) {
          categories.push(category);
        }
      })
    });
    return categories;
  }

})

HTML：

<div data-ng-app="app" data-ng-controller="starWarsCtrl">
    <ul>
        <li class="box" data-ng-repeat="cat in getCategories()">
          <h2>{{cat}}</h2>
      </li>
    </ul>
</div>

Answer 1

您的第二個forEach循環正在處理字符串。 甚至不需要第二個循環。

angular.forEach($scope.data, function(item) {
    //item.cat is a string
    if (categories.indexOf(item.cat) == -1) {
      categories.push(item.cat);
    }
});

您的第一個forEach循環訪問scope.data每個項目。 這些項目是JS對象。 我對Angular和可用的循環不太熟悉，但是通常不能像對象一樣循環數組。 但是，由於只檢查cat屬性，因此不需要遍歷對象。 因此，您此時可以使用該對象。