Question

目前我有一个json文件，可以将信息填充到我的图表中。可以在此处找到此图表的示例：http://marmelab.com/ArchitectureTree/。我还有一个右侧的面板，用于在点击时显示其中一个图表节点的信息。但是，我不知道该怎么做。

说我的json数组是否存在：

{
  "name": "Blogs",
  "url": "blogs.my-media-website.com/*",
  "dependsOn": ["Wordpress MU"],
  "technos": ["PHP", "Wordpress"],
  "host": { "Amazon": ["?"] }
},

我会点击＆＃39;博客＆＃39;在图表和＆＃39; url＆＃39;，＆＃39; dependsOn＆＃39;然后将在面板中显示等。我确定这个函数使用AngularJS来做到这一点。有人能指出我正确的方向吗？

Answer 1

点击下面的博客电话功能：

在控制器中，尝试添加此功能。

$scope.onClickOfBlogs = function(){
         $http.get('Your_JSON_file_Path_here').success(function(response){
                $scope.jsonObject= response;
            }).error(function() {
                console.log('error occured while getting JSON file');
            });
        };

面板HTML中的

： -

<div id ="info">
           <span>URL : {{jsonObject.url}} </span>
           <span>Name : {{jsonObject.name}} </span>
           <ul>
            Depends on :
          <li ng-repeat = "depends in jsonObject.dependsOn"> <!-- to iterate on array you need ng-repeat -->
               {{depends}}
         </li>
 </ul> 

</div>

您将从json文件中获取数据到您的html面板中。希望这会有所帮助。

** **：http://plnkr.co/edit/dbJ0bhHhvASffJU9liY6?p=preview

如何使用AngularJS处理JSON数据？

1 个答案: