0

今現在、AngularJSを利用してPHPを呼び出してMysqlに接続してHTMLで表示というものを作成しようとしていますが
どうもqueryの結果1件も抽出できてないようです

ソースを載せます

main.html

<!DOCTYPE html>
<html lang ="ja">
    <head>
        <title>sample</title>
        <meta charset="UTF-8">

        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.min.js"></script>
        <script src="C:\xampp\htdocs\PHP\controller.js"></script>
    </head>

    <body ng-app = "mainApp" ng-controller="MainCtrl">
        <h2></h2>
        <div>

        <table border = "1">
            <tr>
                <th></th>
                <th>名前</th>
                <th>年齢</th>
                <th>ID</th>
            </tr>
            <tr ng-controller="DetailCtrl" ng-repeat="employee in employees">
                <td>{{employee.id}}</td>
                <td><input ng-model="employee.name"></td>
                <td><input ng-model="employee.age"></td>
                <td><input ng-model="employee.id"></td>
                <td><button ng-click="update()">更新</button></td>
                <td><button ng-click="delete()">削除</button></td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td><input ng-model="new_student.name"></td>
                <td><input ng-model="new_student.age"></td>
                <td><input ng-model="new_student.id"></td>
                <td><button ng-click="add()">追加</button></td>
                <td>&nbsp;</td>
            </tr>
        </table>

    </body>
</html>

controller.js

    var mainApp = angular.module("mainApp", ["ngResource"]);

mainApp.controller("MainCtrl", function($scope, $resource, $window) {


    //呼び出すPHPを定義
    var Employee = $resource('dbController.php', {id: '@id'});
    //dbController.phpからsampleテーブルのレコードを$scope.employeesに格納
    $scope.employees = Employee.query();
/*  $scope.employees = {
        info:[
            {name:'aaa',age:'21',id:'111'},
            {name:'bbb',age:'21',id:'222'},
            {name:'ccc',age:'22',id:'333'}
        ] 
    }*/
    //追加ボタンが押された時
    $scope.add = function() {
        //POSTでPHPを呼び出しレコードを挿入
        Employee.save($scope.new_employee, function() {
            alert("追加しました。");
            //画面をリロード
            $window.location.reload();
        });
    };

});

mainApp.controller('DetailCtrl', function($scope, $window) {
    $scope.update = function() {
        $scope.employee.$save(function() {
            alert("更新しました。");
        });
    };
    $scope.delete = function(index) {
        $scope.employee.$delete();
        alert("削除しました。");
        $window.location.reload();
    };
});

dbController.php

<?php 
//phpinfo();
$host = 'localhost';
$dbname = 'mysql';
$user = 'root';
$pass = 'pass';

try{
    $mysqli = new mysqli($host,$user,$pass,$dbname);

    if($mysqli->connect_errno){
        printf("Connect faild: %s\n",$mysqli->connect_error);
        exit();
    }

    switch($_SERVER['REQUEST_METHOD']){
        case 'GET':
            $sql = "select * from sample";
            $result = $mysqli->query($sql);

            if(mysqli_num_rows($result)){
                while($row = mysqli_fetch_assoc($result)){
                    $arr[] = $row;
                }
            }

            echo $json_info = json_encode($arr);
            break;
        case 'POST':
            $in = json_decode(file_get_contents('php://input'),ture);
            if(isset($in['id'])){
            //if(isset($_GET['id'])) {
                $sql = "UPDATE emp SET name = ? , age = ? where id = ?";
                $stmt = $mysqli->prepare($sql);
                $stmt->bind_param('sss',$name, $age, $id);
                $name = isset($_REQUEST['name']) ? $_REQUEST['name'] : 'dummy_name';
                $name = isset($_REQUEST['age']) ? $_REQUEST['age'] : 1;
                $name = isset($_REQUEST['id']) ? $_REQUEST['id'] : 1;
                $stmt->execute();
            }else{
                $sql = "INSERT INTO sample(name, age) VALUES(?, ?)";
                $stmt = $mysqli->prepare($sql);
                $stmt->bind_param('ss',$name, $age);
                $name = isset($_REQUEST['name']) ? $_REQUEST['name'] : 'dummy_name';
                $name = isset($_REQUEST['age']) ? $_REQUEST['age'] : 1;
                $stmt->execute();
            }

            break;
        case 'DELETE':
            $sql = "DELETE FROM sample WHERE id=?";
            $stmt = $mysqli->prepare($sql);
            $stmt->bind_param('i', $id);
            $id = $_GET['id'];
            $stmt->execute();
            break;
    }
}catch(PD0Exception $e){
    exit('データベース接続失敗。'.$e->getMessage());
}
?>

$scope.employees = Employee.query();

このqueryした結果をemployeesに入れるのですが入れるの要素は0となってしまいます。
試しに、

$scope.employees = {
        info:[
            {name:'aaa',age:'21',id:'111'},
            {name:'bbb',age:'21',id:'222'},
            {name:'ccc',age:'22',id:'333'}
        ] 
    }

と、ベターでデータを入れてみたところ表示は上手く行っています。
dbController.phpをそのまま実行してみたらデータは2件入ってることが確認取れました。

問題はdbController.phpが読み込めていないところにあります。

自分なりにパスを指定して書いたり色々なサイトを参考にしましたが上手く行きません。
わかる方、教えてえてください。

1 件の回答 1

1

Error: [$injector:unpr] の問題は解決しました。

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

この部分に"ngResource"が入っていないと言う単純なミスでした。

var mainApp = angular.module("mainApp", ["ngResource"]);

一回自分で消したことを忘れていたためこのようなミスが起こりました。

2
  • 自己解決したのであれば、どこに問題があり、どう解決したか記載すべきです。また別の問題が発生したのであれば、何について聞きたいのか解決したいのか質問内容を編集し直した方がよろしいかと思います。
    – otak-lab
    Commented 2016年5月31日 9:44
  • @oTak様 ご指摘を受けたとおり修正などしました。 ありがとうございます。
    – minorin
    Commented 2016年5月31日 12:27

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。