Javascript 获取AngularJs中JSON文件的大小返回错误值_Javascript_Html_Angularjs_Json

Javascript 获取AngularJs中JSON文件的大小返回错误值

javascript html angularjs json

Javascript 获取AngularJs中JSON文件的大小返回错误值,javascript,html,angularjs,json,Javascript,Html,Angularjs,Json,大家好，我目前正在学习AngularJS和JS，我正在尝试返回JSON文件中的条目数。JSON文件如下所示： { "title": "Watching the Wheels", "artist": "John Lennon", "year": "1981", }, { "title": "Way Over Yonder in the Minor Key", "artist": "Billy Bragg & Wilco", "year": "1998", }, {

大家好，我目前正在学习AngularJS和JS，我正在尝试返回JSON文件中的条目数。JSON文件如下所示：

{
  "title": "Watching the Wheels",
  "artist": "John Lennon",
  "year": "1981",
},
{
  "title": "Way Over Yonder in the Minor Key",
  "artist": "Billy Bragg & Wilco",
  "year": "1998",
},
{
  "title": "We Are Never Ever Getting Back Together",
  "artist": "Taylor Swift",
  "year": "2012",
},
{
  "title": "We're Going To Be Friends",
  "artist": "The White Stripes",
  "year": "2001",
}

我将它显示在一个页面上，并且必须能够进行即时搜索（这很有效）。我只想让它返回条目数。它当前正在返回

，JSON文件中大约有200个条目

我的html文件如下所示：

<!DOCTYPE html>
<html  ng-app ="ngApp">
<head>
<title>First AngularJS Application</title>
<script src= "/Scripts/angular.js"></script>
<script>document.write("<base href=\"" + document.location + "\" />");</script>
<!--<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>-->
<title>Angular - INDEX</title>
</head>

<body ng-controller="myController">
Artist: <input type="text" ng-model="artist"><br /> # of songs: <span>{{count}}</span>
Order by:
<a href="" ng-click="predicate = 'artist'">Artists</a>
<a href="" ng-click="predicate = 'year'">Year</a>
<ul>
    <li ng-repeat="artist in artists | filter: artist | orderBy: predicate" >
        {{ artist.artist }} | {{ artist.title }} | {{artist.year}}
    </li>
</ul>
<script>
var ngcontr = angular.module('ngApp', []);
    ngcontr.controller('myController', function ($scope, $http) {
        $http.get('data.json')
            .then(function (res) {
                $scope.artists = res.data;
            });
        $scope.predicate = 'year';
        $scope.count = Object.keys(ngcontr).length;
    });
    </script>
</body>
</html>


第一个AngularJS应用程序
文件。填写（“”）；
角指数
艺术家：
歌曲集：{{{count}
订购人：


{{artist.artist}}{{artist.title}}{{artist.year}}


var ngcontr=角度模块（'ngApp'，[]）；
ngcontroller（'myController'，函数（$scope，$http）{
$http.get（'data.json'）
.然后（功能（res）{
$scope.artists=res.data；
});
$scope.predicate='year'；
$scope.count=Object.keys（ngcontr）.length；
});

谢谢你的帮助。也可以在更新搜索时更新计数？

您需要检查数组的长度，而不是对象键

 $http.get('data.json')
 .then(function (res) {
    $scope.artists = res.data;
    $scope.count = $scope.artists.length;
});

你得到的是Angular应用程序实例的键数，而不是数据的键数，这很容易。你知道我怎样才能在搜索完成时自动更新这个数字吗？当你得到响应时，它会自动更新计数。不幸的是，它没有更新计数。这是一个即时搜索btwMark作为答案，如果这有帮助