【问题标题】:AngularJS + PHP + MySQL to display data from databaseAngularJS + PHP + MySQL 显示来自数据库的数据
【发布时间】:2017-07-15 08:34:18
【问题描述】:

有人能告诉我我在这里缺少什么代码来显示我的数据库中的数据吗?非常感激!

HTML

<!DOCTYPE html>
  <html lang="en" ng-app="VinylApp"> 
    <head>
      <meta charset="utf-8">    
      <title>Vinyl Record Store</title> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.min.js"></script>
      <script src="script.js"></script><script src="app.js"></script>
      <link rel="stylesheet" href="main.css">
   </head>

   <body>
     <div ng-app="VinyApp" ng-controller="VinylListController">

       <table>
         <tr ng-repeat="vinyl in vinyls">
           <td>{{vinyl.Vinyl_ID}}</td>
           <td>{{vinyl.VinylName}}</td>
           <td>{{vinyl.Artist}}</td>
           <td>{{vinyl.Price}}</td>
         </tr>
       </table>
     </div> 
   </body> 
 </html>

JS

var app= angular.module('VinylApp', []);
app.controller('VinylListController', function($scope, $http){
  $http.get("db_con.php")
  .then(function(response){
    $scope.vinyls = response.data.records;     
  });
});

PHP

<?php 
  header("Access-Control-Allow-Origin: *"); 
  header("Content-Type:application/json; charset=UTF-8");

  $conn = new mysqli("myServer","myUser", "myPassword", "Northwind");
  $result = $conn->query("SELECT * FROM vinyl");
  $outp= "";
  while($rs=$result->fetch_array(MYSQLI_ASSOC)){
    if ($outp != "") {$outp .= ",";}
    $outp .= '{"VinylID":"'  . $rs["VinylID"] . '",';
    $outp .= '"VinylName":"'   . $rs["VinylName"]        . '",';
    $outp .= '"Artist":"'. $rs["Artist"]     . '",';
    $outp .= '"Price":"'. $rs["Price"]     . '"}'; } $outp ='{"records":['.$outp.']}'; $conn->close();

    echo($outp); 
  }

?>

【问题讨论】:

  • 如果您浏览到db_con.phpfile,您会看到什么响应?您检查了 console.log 是否有任何错误?
  • 您的 PHP 代码无效。车把echo($outp); } 到头来破坏你的代码。
  • 目前我的屏幕上什么都没有,控制台也没有显示任何内容。现在也只是查看网络状态,尝试调试一段时间。我应该用 print($outp);} 代替它吗?
  • 没有那个车把应该是echo($outp);
  • 我所有的网络状态都返回为 200。仍然是空白页

标签: php mysql angularjs database templating


【解决方案1】:

我有解决问题。请尝试此代码对我来说很好。这里添加新的 angular.min.js 并添加了一些更改

var app= angular.module('VinylApp', []);
app.controller('VinylListController', function($scope, $http){
  $http.get("db_con.php")
  .then(function(response){
    $scope.vinyls = response.data;     
  });
});
<!DOCTYPE html>
  <html lang="en" ng-app="VinylApp"> 
    <head>
      <meta charset="utf-8">    
      <title>Vinyl Record Store</title> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.24/angular.min.js"></script>
	  <script src="app.js"></script>
      <script src="script.js"></script>
      
   </head>
   <body ng-app="VinyApp">
     <div  ng-controller="VinylListController">
       <table>
         <tr ng-repeat="vinyl in vinyls">
           <td>{{vinyl.Vinyl_ID}}</td>
           <td>{{vinyl.VinylName}}</td>
           <td>{{vinyl.Artist}}</td>
           <td>{{vinyl.Price}}</td>
         </tr>
       </table>
     </div> 
   </body> 
 </html>
 
 
 <?php 
  
  $conn = new mysqli("localhost","root", "", "pinakin_northwind");
  $result = $conn->query("SELECT * FROM vinyl");
  $outp = array();
  while( $rs = $result->fetch_array(MYSQLI_ASSOC)) {
		$outp[] = $rs;
  }
	echo json_encode($outp);	
?>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-04-21
    • 2015-07-06
    • 2013-01-06
    • 2020-09-05
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多