質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

解決済

AngularJS+PHP+MySQLでresourceを同時にrouting(ルーティング)もしたい

xxx_aoi
xxx_aoi

総合スコア0

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

2回答

0評価

0クリップ

2175閲覧

投稿2016/12/20 15:54

AngularJS+PHP+MySQLでCRUD入門 http://qiita.com/naga3/items/cacb8182ad79dbbf6e64 のサイトの記事をベースで同じ機能をもたせながらrouting機能も持たせたものを作成しようとしているのですがうまくいきません。

index.htmlで表示されているものをlist.htmlで表示させようとしています。

index.html <!doctype html> <html lang="ja" ng-app="app"> <head> <meta charset="utf-8"> <title>名簿</title> </head> <body> <!--表示部分をlist.htmlに移す--> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-resource.min.js"></script> <!--routingを使うために設定 --> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-route.min.js"></script> <script src="route.js"></script> <script src="controller.js"></script> </body> </html>
list.html <!--index.htmlの表示部分をそのまま移す--> <!doctype html> <ng-controller="MainCtrl"> <table border="1"> <tr><th>ID</th><th>名前</th><th>年齢</th><th>コメント</th></tr> <tr ng-controller="DetailCtrl" ng-repeat="student in students"> <td>{{student.id}}</td> <td><input ng-model="student.name"></td> <td><input ng-model="student.age"></td> <td><input ng-model="student.comment"></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.comment"></td> <td><button ng-click="add()">追加</button></td> <td>&nbsp;</td> </tr> </table>
route.js routingできるよう記述 angular.module('myApp', [ 'ngRoute' ]) // 1configメソッドに$routeProviderプロバイダーを注入 .config(['$routeProvider', function($routeProvider){ $routeProvider .when('/', { templateUrl: 'list.html', controller: 'MainCtrl' //↑DetailCtrlも使うがコントローラーを2つ使う場合の書き方がわからない。 }) .otherwise({ redirectTo: '/' }); }]);
controller.js そのまま使用 var app = angular.module('app', ['ngResource']); app.controller('MainCtrl', function($scope, $resource, $window) { var Student = $resource('students.php', {id: '@id'}); $scope.students = Student.query(); $scope.add = function() { Student.save($scope.new_student, function() { alert("追加しました。"); $window.location.reload(); }); }; }); app.controller('DetailCtrl', function($scope, $window) { $scope.update = function() { $scope.student.$save(function() { alert("更新しました。"); }); }; $scope.delete = function(index) { $scope.student.$delete(); alert("削除しました。"); $window.location.reload(); }; });
students.php そのまま使用 <?php $pdo = new PDO('mysql:dbname=school', 'root'); switch ($_SERVER['REQUEST_METHOD']) { case 'GET': $st = $pdo->query("SELECT * FROM students"); echo json_encode($st->fetchAll(PDO::FETCH_ASSOC)); break; case 'POST': $in = json_decode(file_get_contents('php://input'), true); if (isset($in['id'])) { $st = $pdo->prepare("UPDATE students SET name=:name,age=:age,comment=:comment WHERE id=:id"); } else { $st = $pdo->prepare("INSERT INTO students(name,age,comment) VALUES(:name,:age,:comment)"); } $st->execute($in); break; case 'DELETE': $st = $pdo->prepare("DELETE FROM students WHERE id=?"); $st->execute([$_GET['id']]); break; }

これだと何も表示されません。

index.htmlの中身を移してroute機能を軽く入れるだけなのでベースからそこまで大きな変化をしてないはずなんですが・・・。あと複数コントローラー1画面で使用の方法もよくわかりません。

長文で申し訳ございませんが、よろしくお願いします。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。