angular.js - angualr的json获取的问题。

问题描述

问 题

有多个a标签（a标签1，a标签2，a标签3），每个按钮对应不同的JSON数据（JSON1，JSON2，JSON3）。请问怎么设置我点击第一个a标签加载对应的JSON的数据呢？

用ng-repeat循环了多个a标签出来。

<a class="itemx" id="{{data.id}}" ng-repeat="data in toploops" ui-sref="{{data.sref}}" ng-click="topBanner($event,$index)">
        <div class="image"><img ng-src="{{data.image}}"/></div>
        <h4>{{data.title}}</h4>
        <p>{{data.dec}}</p>
</a>

然后跳转到问题目标页。也是用ng-repeat循环出来的。就想在上一个页面跳转到这里获取不同的json内容。

<div class="card" ng-repeat="data in test">        
    <div class="item item-text-wrap">
        {{data.title}}
    </div>
    <div class="item-image">
        <img ng-repeat="x in data.image" ng-src="{{x}}"/>    
    </div>
</div>

对应的JSON文件。

    "JSON0":[{
        "image":["img/001.jpg","img/002.jpg","img/026.jpg","img/014.jpg"],
        "title":"1234"
    }],
    "JSON1":[{
        "image":["img/019.jpg","img/013.jpg"],
        "title":"4567"
    }}],
    "JSON2":[{
        "image":["img/029.jpg","img/014.jpg"],
        "title":"78910"
    }]

获取JSON设置。

app.controller("content",function($scope,$http){
        $scope.$watch("viewContentLoaded",function(){
            $http({
            method:"GET",
            url:"./zt.json"
        }).then(function(response){
            //var test1 = response.data.zt.JSON0;
            //$scope.test = test1;
        
            $scope.topBanner = function($event,$index){
                var test1 = "response.data.zt.ztTopbanner"+$index;
                $scioe.test = test1;
        }
        })

一开始是想动态改获取JSON的路径的。谁知道报错了。。大概说是不允许动态修改还是怎么的吧？只能指定的值？？我也不太懂。所以求解！新手卡在这里了！找了很久也找不到办法！
请大家指教下拉！麻烦了 ！

解决方案

AngularJS does not allow duplicates in a ng-repeat directive. This means if you are trying to do the following, you will get an error.

However, changing the above code slightly to define an index to determine uniqueness as below will get it working again.

// This will work
<div ng-repeat="row in [1,1,1] track by $index">

这篇关于angular.js - angualr的json获取的问题。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！