簡體   English   中英

如何使用Angular Js以從node.js服務器檢索的表格式顯示json數據

[英]How to show json data in a table format retrieved from node.js server using Angular Js

這是我制作的一個索引文件,用於通過angular.js顯示json數據

<!DOCTYPE html>
<html>
<head>
<style>
table, th , td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
<script src= “http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js”></script>
</head>
<body>

<div ng-app=”” ng-controller=”blogController”>

<table>
<tr><td>Manger Id</td><td>Manger Name</td></tr>
  <tr ng-repeat=”x in name”>
    <td>{{ x.m_id }}</td>

<td>{{ x.name }}</td>


  </tr>
</table>

</div>

<script>
function blogController($scope,$http) {
$http.get('http://localhost:3000/techgeek/v1/getEmployeeDetails')
.success(function(response) {
    $scope.names = response;
    console.log($scope.names);
});
}
</script>

</body>
</html>

我無法從nodejs服務器獲取json數據。 我還通過nodejs切斷了對我的json數據的保密提示。 在此處輸入圖片說明 網址的主要問題。 謝謝您的幫助

這是為您解決的問題。 我已經使用本地Json解決了它。 您犯了以下錯誤:

  1. ng-repeat名稱應該在那里,因為您的控制器中有$ scope.names。
  2. x.name第二欄為您的JSON是具有x.m_name作為字段這是錯誤的。
  3. 另外,我懷疑node.js服務器和angular應用程序是否在同一端口上運行,否則您可能會在控制台中收到CORS (跨源資源共享)錯誤,必須對其進行修復。

柱塞

   <tr><td>Manger Id</td><td>Manger Name</td></tr>
   <tr ng-repeat="x in names track by $index">
        <td>{{ x.m_id }}</td>
        <td>{{ x.m_name }}</td>
   </tr>

更新1

您的模塊有問題,因為您在代碼中使用了ng-app="" ,請使用以下模塊進行修復

var app = angular.module('plunker', []);
app.controller("",function(){
 .....................
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM