Angular解析Json内部数组

时间:2016-02-03 05:15:10

标签: javascript jquery angularjs json

在我的代码中

enter image description here我有一个显示json对象的角度ng-repeat。此对象中的一个字段是一个数组,当我使用角度语法{{item.tags}}显示它时,它会按预期显示为原始json文本。但每当我试图解析它,或替换文本时,它都没有这样做。几乎就像它忽略了实际的html,它只看到了角度语法。我可能做错了什么

但这是我的代码

<div class="col-md-2">

    <div id="top-ten-list" class="list-group" ng-controller="ToptenController as topten">
        <div  data-toggle="collapse" data-target="#collapseTopTen" class="list-group-item active" onclick="accordianToggle(this)" >
            <h3 class="inline-header">Top Ten Games<span class="pull-right"><i id="links-caret" class="fa fa-caret-up"></i></span></h3>
        </div>
        <div id="collapseTopTen" class="panel-collapse collapse in" >
            <span ng-repeat="item in topten.gameList | limitTo:10 | reverse" bs-popover/><button type="button" bs-popover rel="popover" data-trigger="focus" data-original-title="{{item.title}}" class="list-group-item" data-content="{{item.tags}}" >
                {{item.title}}
            </button>
        </div>  
    </div>

</div>



var app = angular.module('main',[]);

//reverse JSON order.
app.filter('reverse', function() {
    return function(items) {
        return items.slice().reverse();
    };
});

app.directive('bsPopover', function() {
    return function(scope, element, attrs) {
        element.find("[rel=popover]").popover({ placement: 'bottom', html: 'true'});
    };
});



app.controller('ToptenController',function(){

    this.gameList = topten;

    this.writeout=function(item){
        console.log(item);
    };

    this.printTags = function(item){
        for ( i = 0; i < 1; i++)
        console.log(item[i]);
    };

});

我的代码将返回下面的图片

最终我希望它被platformerhack取代

这是我用作参考的json。

[{
    "title": "Super Mario Unlimited",
    "description": "text desc here ",
    "image": "image href here",
    "image2": "",
    "youtube": "http://youtu.be/O8y-CTSwMr8",
    "developer": "",
    "tags": [{
        "tag": "platformer"
    },{
        "tag": "hack"
    }]
}]

0 个答案:

没有答案