AngularJS对于$scope中的项目$scope未定义的

AngularJS $scope undefined for item inside $scope

本文关键字：scope 未定义 项目 对于 AngularJS      更新时间：2023-09-26

我对AngularJS很陌生。

我给自己一个小项目来创建本地企业列表，然后能够"喜欢"每个企业 - 每次点击"喜欢"div 时，喜欢的数量都会增加 1。

这是我的网页

<ion-content ng-controller="BusCtrl" ng-init="init()" class="has-header">
<div class="list">
  <div ng-repeat="item in nodes" class="item">
    <b>{{item.node.title}}</b><br>
    <b>{{item.node.website}}</b><br>
    <img ng-src="{{ item.node.main_image.src }}">
    <div class="engagement">
      <p class="likes" ng-click="plusOne($index)">{{item.node.likes}}</p>
    </div>
    <span ng-bind-html="item.node.summary"></span>
  </div>
</div>

这是我的控制器代码

.controller('BusCtrl', function($scope, $http) {
  $scope.init = function() {
    $http.get("sample-json/business-directory.json")
      .success(function(data) {
          $scope.nodes = data.nodes;
          $scope.plusOne = function(index) {
            $scope.nodes.node[index].likes += 1;
          };
          $scope.browse = function(v) {
            window.open(v, "_system", "location=yes");
          };
          window.localStorage["nodes"] = JSON.stringify(data.nodes);
      })
      .error(function(data) {
          console.log("ERROR: " + data);
          if(window.localStorage["nodes"] !== undefined) {
            $scope.entries = JSON.parse(window.localStorage["nodes"]);
          }
      });
  };
})

下面是一些示例 JSON

{
"nodes": [
    {
        "node": {
            "title": "2013 Business Survey",
            "website": "http://www.portumnachamber.ie",
            "likes": 0,
            "main_image": {
                "src": "http://portumnachamber.com/sites/default/files/styles/main-business-image-teaser/public/LOVEPORTUMNA_FINAL%20LOGO_%20small_3.jpg?itok=L5IE2Du_",
                "alt": "Portumna Business Survey 2013, What does Portumna Co. Galway need and want"
            }
        }
    },
    {
        "node": {
            "title": "All Occasions Boutique, Portumna",
            "website": "http://www.portumnachamber.com",
            "likes": 0,
            "main_image": {
                "src": "http://portumnachamber.com/sites/default/files/styles/main-business-image-teaser/public/all%20occasions%201.jpg?itok=LFvCQIAT",
                "alt": "Boutique Clothes Shop Portumna county Galway Ireland, All Occasions, Portumna"
            }
        }
    },
    {
        "node": {
            "title": "Anthony Williams",
            "website": "http://www.portumnachamber.com",
            "likes": 0,
            "main_image": {
                "src": "http://portumnachamber.com/sites/default/files/styles/main-business-image-teaser/public/default_images/portumna-coc-logo.png?itok=V9G81lx4",
                "alt": ""
            }
        }
    },
]

}

我得到了每个企业的列表 - 标题，网站，图像和喜欢的数字0。但是，当我单击0时，出现此错误：

Error: $scope.nodes.node is undefined

似乎这是$scope中的$scope或类似的东西。

有什么提示吗？多谢。

我将假设您的节点数据源上没有另一个node数组属性。在这种情况下，您的函数plusOne变为：

$scope.plusOne = function(index) {
    $scope.nodes[index].node.likes += 1;
};

您正在迭代（ng-repeat）作用域中的nodes变量，因此您必须将indexer放在该属性上。 $scope.nodes是您的数组，而不是$scope.nodes.node .对于$scope.nodes中的每个项目，您都有一个node属性。

例如，$scope.nodes[0]为您提供具有.node属性的第一项。

您使用了错误的结构。节点是数组，因此您需要在那里应用索引，而不是节点。节点是一个包含参数"likes"的对象。此处未定义的项目nodes.node[index]而不是$scope

要访问节点，您应该编写$scope.nodes[index].node.likes += 1;

根据您的 JSON 请更改

$scope.nodes.node[index].likes += 1;

自

$scope.nodes[index].node.likes += 1;
相关文章：