当前位置: 首页 > 面试题库 >

使用AngularJS访问嵌套的JSON

傅志诚
2023-03-14
问题内容

我正在尝试使用angular.js,hammer.js和topcoat制作和移动webapp。

我在显示像这样的Json文件中的数据时遇到了一些麻烦:

{
"version": "1",
"artists": {
    "artist1": {
        "name": "artist1name",
        "jpeg": "../img/artist/artist1.jpg",
        "albums": {
            "album1": {
                "type": "cd",
                "title": "titlealbum1",
                "subtitle": "subtitlealbum1",
                "jpeg": "../img/album1.jpg",
                "price": "12.00",
                "anystring1": "anystring1album1",
                "anystring2": "anystring2album1"
            },
            "album2": [{
                "type": "cd",
                "title": "titlealbum2",
                "subtitle": "subtitlealbum2",
                "jpeg": "../img/album2.jpg",
                "price": "12.00",
                "anystring1": "anystring1album2",
                "anystring2": "anystring2album2"
            }],
            "album3": [{
                "type": "cd",
                "title": "titlealbum3",
                "subtitle": "subtitlealbum3",
                "jpeg": "../img/album3.jpg",
                "price": "13.00",
                "anystring1": "anystring1album3",
                "anystring2": "anystring2album3"
            }]
        }
    },
    "artist2": {
        "name": "artist2name",
        "jpeg": "../img/artist/artist2.jpg",

我的js文件是这样的:

angular.module('list', [])
function ListCtrl ($scope, $http) {
$http({method: 'GET', url: 'json/json_price_1.json'}).success(function(data)
{
$scope.artists = data.artists; // response data 
$scope.albums = data.artists.albums; /this is where im getting trouble
});        
};

我的HTML文件是这样的:

<body ng-app="list">

<h3>Titulos</h3>

<div ng-controller="ListCtrl">
<ul ng-repeat="artist in artists">
        <li >{{artist.name}}</li>

    </ul>
</div>

<div ng-controller="ListCtrl">
<ul ng-repeat="album in albums">
        <li >{{album.title}}</li>  //not working here.

    </ul>
</div>

我想显示所有专辑,并且如果我的用户选择特定的艺术家,我想过滤那些专辑。
这里的问题是如何在此嵌套json上进行选择。顺便说一句,artist.name显示正确。

第二个问题是,如何过滤带有文本字段的艺术家。


问题答案:

我建议是这样的:

$http({method: 'GET', url: 'json/json_price_1.json'}).success(function(data) {
    $scope.artists = [];
    angular.forEach(data.artists, function(value, key) {
        $scope.artists.push(value);
    });
    $scope.isVisible = function(name){
        return true;// return false to hide this artist's albums
    };
});

然后:

<div ng-controller="ListCtrl">
    <ul>
        <li ng-repeat="artist in artists">{{artist.name}}</li>
    </ul>
    <ul ng-repeat="artist in artists" ng-show="isVisible(artist.name)">
        <li ng-repeat="album in artist.albums">{{album.title}}</li>
    </ul>
</div>


 类似资料:
  • 问题内容: 为什么以下SQL语句不起作用? 它产生此错误: 查询输入必须至少包含一个表或查询。 单个语句有效。 问题答案: Access SQL语句不会让您对以下其中一项使用子查询 按照Piotr的建议,切换到语句即可。 或者,您可以在语句中使用Access Domain Aggregate函数而不是子查询:

  • 我有以下HTML代码的网页: 我试过这个。WebDriverWait(驱动程序,10).Unilt(ec.frame_to_available_and_switch_to_it((by.css_selector,“iframe.iframetgr”)))WebDriverWait(驱动程序,10).Unilt(ec.frame_to_available_and_switch_to_it((by.n

  • 我从foursquare收到了一个json形式的响应。我尝试访问对象的某些部分,但没有成功。如何访问对象的地址?这是我试过的代码。 以下是json响应的一个示例: 完整的回应可以在这里找到

  • 问题内容: 不固定f1.png值时如何访问inval值。即文件名可以是任何东西,它不知道,所以我如何使用Java访问此JSON中各种文件的inval字段值? 问题答案: 请尝试以下代码, 希望它能解决您的问题

  • 假设我有几个这样的类: 我想迭代所有包含的子类(不是继承的),并获得嵌套对象树中所有字段的列表。但是,当我使用这样的反射代码时: 在“do somethine here”步骤中,我想访问myField的子字段,但在Field api中没有看到任何直接允许我这样做的内容。我试过: MyField.getDeclaringClass(). getDeclaredFields()- 和 MyField.

  • 我试图使用spring WebFlux/Reactor对数据库进行嵌套调用,以返回一个嵌套对象(一个用户和他的角色)。 场景如下: null 上面的场景必须在没有阻塞的情况下完成(我知道映射是一个很小的阻塞:))。 提前感谢您的帮助。