如何使用angularjs

-2

，這是我的代碼，以便訪問嵌套JSON數組，並需要檢索JSON數據如何使用angularjs

這是我的JSON數據的某些部分，在這方面，我需要找回拓撲ID，節點ID，TP-ID這是在嵌套的JSON數組這麼寫一些代碼只是檢查一次，我是很新的angularjs.so幫我出這個問題

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-base64/2.0.5/angular-base64.js"></script> 
 
<body> 
 
<div ng-app="list"> 
 
<div ng-controller="ListCtrl"> 
 
<ul ng-repeat="data in network-topology"> 
 
     <li >{{data.topology}}</li> 
 

 
    </ul> 
 
</div> 
 
<div ng-controller="ListCtrl"> 
 
<ul ng-repeat="data1 in topology"> 
 
     <li >{{data1.topology-id}}</li> 
 
</ul> 
 
</div> 
 
<div ng-controller="ListCtrl"> 
 
<ul ng-repeat="data2 in node"> 
 
     <li >{{data2.node-id}}</li> 
 

 
    </ul> 
 
</div> 
 

 
<div ng-controller="ListCtrl"> 
 
<ul ng-repeat="data3 in termination-point"> 
 
     <li >{{data3.tp-id}}</li> 
 
    </ul> 
 
</div> 
 
<script> 
 
var app = angular.module('list', ['base64']); 
 
app.controller('ListCtrl', function($scope, $http, $base64) { 
 

 
$http.defaults.headers.common = {"Access-Control-Request-Headers": "accept, origin, authorization"}; 
 
$http.defaults.headers.common['Authorization'] = 'Basic ' + $base64.encode('admin' + ':' + 'admin'); 
 

 
    $http({ 
 
    method: 'GET', 
 
    url: 'http://10.132.32.212:8181/restconf/operational/network-topology:network-topology/', 
 
    contentType: 'application/json; charset=utf-8', 
 
    }).success(function(tdata) { 
 
\t $scope.network-topology= tdata.network-topology; 
 
\t $scope.topology= tdata.topology; 
 
\t $scope.topology-id = tdata.topology-id; 
 
    $scope.node-id = tdata.node-id; 
 
\t $scope.tp-id = tdata.tp-id; 
 
    $scope.topology= []; 
 
    $scope.node= []; 
 
    $scope.termination-point= []; 
 
    angular.forEach(tdata.network-topology, function(network-topology, index){ 
 
       angular.forEach(network-topology.topology, function(topology, index){ 
 
    \t \t  angular.forEach(network-topology.topology.node, function(node, index) { 
 
        angular.forEach(network-topology.topology.node.termination-point, function(termination-point, index){ 
 
               $scope.termination-point.push(termination-point); 
 
      }); 
 
    \t }); 
 
     }); 
 
    }); 
 

 
</script> 
 
</body> 
 
</html>

來源

2017-03-07 pramanaga koushik

請發表您的JSON數據'tdata' – Nishant123

{ 「網絡拓撲」：{ 「拓撲」： {「topology-id」：「flow：1」，「node」：[「node-id」：「openflow：1」，「termination-point」：[ {「tp-id」：「openflow：1：2」，「opendaylight-topology-inventory：inventory-node-connector-ref」：「/ opendaylight-inventory：nodes –

當您使用「 - 」在屬性成爲angularjs減法所以，建議用戶下劃線（網絡拓撲結構，而不是network_topology）

$rootScope.jsonData={ 
"network-topology": { 
    "topology": [{ 
    "topology-id": "flow:1", 
    "node": [{ 
     "node-id": "openflow:1", 
     "termination-point": [{ 
     "tp-id": "openflow:1:2", 
     "opendaylight-topology-inventory:inventory-node-connector-re‌f": "/opendaylight-in‌ventory:nodes" 
     }] 
    }] 
    }] 
} 
}

視圖

<div ng-repeat='data1 in data["network-topology"].topology'> 
      {{data1["topology-id"]}} 
      <div ng-repeat='data2 in data1.node'> 
       {{data2["node-id"]}} 

      <div ng-repeat='data3 in data2["termination-point"]'> 
       {{data3["tp-id"]}} 
      </div> 
      </div> 
     </div>

輸出：

flow:1 
openflow:1 
openflow:1:2

來源

2017-03-07 05:52:45 Harish98

但我必須從json數據中獲得url和json數據可以隨時增加，因爲它是一個網絡配置 –

，你可以給我發送整個代碼 –

只是將你的響應複製到一個變量中，並在它上面顯示輸出。 – Harish98

這是完整的代碼，一旦檢查這個，讓我知道

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<body> 
 
<div ng-app="list"> 
 
<div ng-controller="ListCtrl"> 
 
<div ng-repeat='data1 in data["network-topology"].topology'> 
 
      {{data1["topology-id"]}} 
 
      <div ng-repeat='data2 in data1.node'> 
 
       {{data2["node-id"]}} 
 

 
      <div ng-repeat='data3 in data2["termination-point"]'> 
 
       {{data3["tp-id"]}} 
 
      </div> 
 
      </div> 
 
     </div> 
 
<script> 
 
angular.module('list', []).controller('ListCtrl', function($rootScope) { 
 
    $rootScope.jsonData={ 
 
"network-topology": { 
 
    "topology": [{ 
 
    "topology-id": "flow:1", 
 
    "node": [{ 
 
     "node-id": "openflow:1", 
 
     "termination-point": [{ 
 
     "tp-id": "openflow:1:2", 
 
     "opendaylight-topology-inventory:inventory-node-connector-re‌f": "/opendaylight-in‌ventory:nodes" 
 
     }] 
 
    }] 
 
    }] 
 
} 
 
} 
 
}); 
 
</script> 
 
</body> 
 
</html>

來源

2017-03-07 06:22:35

我認爲這將是您的最終代碼

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-base64/2.0.5/angular-base64.js"></script> 
 
    <body> 
 
    <div ng-app="list"> 
 
    <div ng-controller="ListCtrl"> 
 
    <div ng-repeat='data1 in data["network-topology"].topology'> 
 
      {{data1["topology-id"]}} 
 
      <div ng-repeat='data2 in data1.node'> 
 
       {{data2["node-id"]}} 
 

 
      <div ng-repeat='data3 in data2["termination-point"]'> 
 
       {{data3["tp-id"]}} 
 
      </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div> 
 
    <script> 
 
var app = angular.module('list', ['base64']); 
 
app.controller('ListCtrl', function($scope, $http, $base64) { 
 

 
    $http.defaults.headers.common = {"Access-Control-Request-Headers": "accept, origin, authorization"}; 
 
    $http.defaults.headers.common['Authorization'] = 'Basic ' + $base64.encode('admin' + ':' + 'admin'); 
 

 
$http({ 
 
    method: 'GET', 
 
    url: 'http://10.132.32.212:8181/restconf/operational/network-topology:network-topology/', 
 
    contentType: 'application/json; charset=utf-8', 
 
}).success(function(tdata) { 
 
    $scope.data= tdata; 
 
    
 
     }); 
 
    }); 
 
    
 

 
</script> 
 
</body> 
 
</html>

來源

2017-03-07 06:51:16 Harish98

但我沒有得到任何東西，空的瀏覽器顯示 –

你有沒有得到任何迴應在$ scope.data – Harish98

我是獲取數據 –

如何使用angularjs

回答

相關問題