AngularJS链接到数据库

时间:2015-06-12 04:22:14

标签: php angularjs

的index.php

<!doctype html>
<html ng-app="rjtApp">
<head>
<title>PHP MySQL API Consumed with AngularJS</title>
<script src="angular.min.js"></script>
<script src="data.js"></script>
</head>

<body>
<div ng-controller="GetUsers">

<table>
<thead><tr><th>Name</th></tr></thead>
<tbody>
<tr ng-repeat="user in users"><td>{{ user.name }}</td></tr>
</tbody>
</tfoot></tfoot>
</table>

</div>
</body>

</html>

api.php(我测试过这个连接没问题。)

<?php

        // set up the connection variables
        $db_name  = 'air';
        $hostname = '127.0.0.1';
        $username = 'root';
        $password = '123456';

        // connect to the database
        $dbh = new PDO("mysql:host=$hostname;dbname=$db_name", $username, $password);

        // a query get all the records from the users table
        $sql = 'SELECT USER_NAME FROM air_users LIMIT 1';

        // use prepared statements, even if not strictly required is good practice
        $stmt = $dbh->prepare( $sql );

        // execute the query
        $stmt->execute();

        // fetch the results into an array
        $result = $stmt->fetch( PDO::FETCH_ASSOC );

        // convert to json
        $json = json_encode( $result );

        // echo the json string
        echo $json;
?>

data.js

alert("this is connect");

var app = angular.module("rjtApp", []);

app.controller("GetUsers", function($scope, $http)

{

  function getProject(){

      $http.get("api.php").success(function(data){

        $scope.projects = data; //the data are stored in projects

 });

};

});

getProject();

我的目的是进行实时验证以检查退出的数据库名称,但我甚至无法计算如何将AngularJS连接到数据库,我一直在做错什么?

2 个答案:

答案 0 :(得分:0)

在我看来,你的重要问题是你使用的是$ http.post而不是$ http.get。 Post用于提交更改和新对象(想想提交表单),而get用于获取输出。

所以,你应该可以改变

$http.get("api.php").success(function(data){
    $scope.projects = data; //the data are stored in projects
}); 

alert(JSON.stringify(varname)) 

这将在项目中存储加载api.php的输出(就好像你自己访问了网站而不是代码)。一个有用的调试技巧是放

alert(JSON.stringify($scope.projects)).
如果您想调试,请在代码中

。这将弹出一个包含变量的JSON内容的警报作为字符串。在你的情况下,这将是:

composer require laracasts/generators --dev

我为任何代码格式问题道歉。我是堆栈溢出系统的新手。

答案 1 :(得分:0)

您正在从控制器外部调用alert("this is connect"); var app = angular.module("rjtApp", []); app.controller("GetUsers", function($scope, $http) { function getProject() { $http.get("api.php").success(function(data) { $scope.projects = data; //the data are stored in projects }); }; getProject(); // moved this line }); ,因此它未定义(它在控制器本地)。所以把这个电话转移到里面:

$http

然后,GET服务应该运行。从技术上讲,您应该使用POST请求,但它仍然会以projects的方式运行。我想指出您目前没有在页面中的任何位置使用dplyr - 因此您只能在网络控制台中看到数据。