無法使用angular.js和PHP綁定數據視圖

我需要使用Angular.js在頁面上顯示數據。首先，我使用PHP從數據庫獲取所有數據。這裏沒有數據顯示在頁面上。我在瀏覽器控制檯中獲取下面檢索的數據。無法使用angular.js和PHP綁定數據視圖

all data [{"0":"1","id":"1","1":"","name":"","2":"","pass":"","3":"","email":""},{"0":"2","id":"2","1":"subhra","name":"subhra","2":"12345","pass":"12345","3":"[email protected]","email":"[email protected]"},{"0":"3","id":"3","1":"rakesh","name":"rakesh","2":"0901209474","pass":"0901209474","3":"maini","email":"maini"},{"0":"4","id":"4","1":"raj","name":"raj","2":"23457","pass":"23457","3":"rai","email":"rai"},{"0":"5","id":"5","1":"Rahul","name":"Rahul","2":"098765","pass":"098765","3":"shinha","email":"shinha"}]

我在下面解釋我的代碼。

read.js：

var app=angular.module('Read_data',[]); 
app.controller('readController',function($scope){ 
    $.ajax({ 
     type:'GET', 
     url:"php/read.php", 
     success: function(data){ 
      $scope.data=data; 
      console.log('all data',$scope.data); 
     } 
    }) 
});

read.php：

<?php 
//database settings 
$connect = mysqli_connect("localhost", "root", "*******", "AngularTest"); 
$result = mysqli_query($connect, "select * from users"); 
$data = array(); 
while ($row = mysqli_fetch_array($result)) { 
    $data[] = $row; 
} 
    print json_encode($data); 
?>

的index.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="Read_data"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Demo of Angular.js</title> 
<link rel="stylesheet" href="css/style.css" type="text/css" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src="js/angularjs.js" type="text/javascript"></script> 
<script src="js/read.js" type="text/javascript"></script> 
</head> 

<body> 
<center ng-controller="readController"> 

<div id="body"> 
<div id="content"> 
    <table align="center"> 
    <tr> 
    <th colspan="5"><a href="add_data.html">add data here.</a></th> 
    </tr> 
    <th> Name</th> 
    <th> Email</th> 
    <th> Password</th> 
    <th colspan="2">Operations</th> 
    </tr> 
     <tr ng-repeat="users in data"> 
     <td>{{users.name}}</td> 
     <td>{{users.email}}</td> 
     <td>{{users.pass}}</td> 
    <td align="center"><a href="edit_data.php?edt_id={{users.id}}"><img src="images/pencil_small.png" align="EDIT" /></a></td> 
     <td align="center"><a href="javascript:delete_id('')"><img src="images/cross-small-icon.png" align="DELETE" /></a></td> 
     </tr> 
    </table> 
    </div> 
</div> 

</center> 
</body> 
</html>

請幫我解決這個問題，併成功綁定表中的所有數據。

來源

2015-09-25 satya

你在哪裏使用數據-NG-應用= 「READ_DATA」 –

@raveenanigam：檢查我更新的代碼。 – satya

Angular不知道更新的數據。如果您沒有將$http用於AJAX，請使用$scope.$apply。

var app=angular.module('Read_data',[]); 
app.controller('readController',function($scope){ 
    $.ajax({ 
     type:'GET', 
     url:"php/read.php", 
     success: function(data){ 
      $scope.$apply(function(){ 
       $scope.data = angular.fromJson(data); 
      }); 
      console.log('all data',$scope.data); 
     } 
    }) 
});

或使用$http（推薦）

var app=angular.module('Read_data',[]); 
app.controller('readController',function($scope, $http){ 
    $http.get('php/read.php'). 
     then(function(data) { 
      // this callback will be called asynchronously 
      // when the response is available 
      $scope.data = data.data; 
     }, function(response) { 
      // called asynchronously if an error occurs 
      // or server returns response with an error status. 
     }); 
});

來源

2015-09-25 09:28:52

這裏我的問題是我無法在頁面上顯示數據。 – satya

你能解釋一下嗎，有什麼問題？爲什麼你不能在頁面上顯示它？ –

@ Rene：我得到這樣的值'all data [{「id」：「2」，「name」：「subhra」，「pass」：「12345」，「email」：「[email protected] 「}，{」 ID 「：」 3" ，「名稱」：「勒凱什」，「通」：「0901209474」，「電子郵件」：「邁尼」}，{ 「ID」：「4」，「姓名」：「拉吉」，「傳」：「23457」，「電子郵件」：「拉伊」}，{ 「ID」：「5」，「名」：「拉胡」，「通」：「098765」，「電子郵件」：「shinha」}]'在控制檯中但無法顯示。請檢查我的html頁面。 – satya

無法使用angular.js和PHP綁定數據視圖

回答

相關問題