내 PHP 서비스를 사용하여 AngularJS를 mysql에 연결 하시겠습니까?

Question

내 Mac에서 localhost와 함께 AngularJS 1.0, PHP 및 mysql을 사용하고 있습니다.

저는 아주 간단한 mysql 데이터베이스를 가지고 있습니다 : "cats". 그것에는 "새끼 고양이"라고 불리는 하나의 테이블이있다. 표에는 두 개의 열, "id"및 "name"이 있습니다. 래리 (Larry), 컬리 (Curly), 모에 (Moe)라는 이름의 데이터베이스에 세 개의 새끼 고양이가 있습니다.

이제 DBASE를 열고 세 개의 레코드를 가져온 간단한 PHP 코드가 있는데 다음과 같이 JSON으로 반환합니다. [{ "id": "1", "name": "Larry"},

나는 최신의 앵귤러 씨드를 사용하여 설정했습니다. (예 : "2", "name": "Curly"), { "id": "3" Eclipse의 프로젝트. app.js에서 나는 이것을 썼습니다 : 'use strict'; angular.moduleservices 폴더에 PHP 코드를 삽입하고 "index.php"라는 이름을 붙였습니다. (예 : 'Cats', [ 'ngResource', 'Cats.filters', 'Cats.services', 'Cats.services', 'Cats.directives']) ". Mac에서 localhost를 사용하여 내 브라우저에서 해당 서비스/index.php를 탐색하면 위의 JSON이 반환됩니다. 지금까지 모든 것이 멋지다.

Now - 내가하고 싶은 모든 것 (! 유명 마지막 단어)은 내가 가지고있는 PHP 서비스에 연결하고 내 AngularJS 프로젝트를 사용하여 내 기본 색인 페이지에 해당 Cats 테이블의 내용을 표시합니다. 일반 텍스트, 테이블 없음, 사용 가능한 리소스에 바인드하여 표시.

저는 온라인 데모를 여러모로 사용해 봤습니다. 누구든지이 일을하는 단순하고 현재의 방법 하나를 보여줄 수 있습니까? 내 삶을 위해 모든 종류의 AngularJS 데모가 작동하지만 아무도이 간단한 작업을 이해할 수있는 방식으로 수행하지 않습니다.

미리 감사드립니다.

Answer 1

또한 작동해야합니다. 그것은 코드의 훨씬 적은 수의 라인을하지만 오류 처리가 제거 된 참고 :

function FetchCtrl($scope, $resource) { 
    var services = $resource('../services/index.php'); 
    $scope.data = services.query(); 
} 
FetchCtrl.$inject = ['$scope', '$resource']; 

는 일반적으로 나는이 $resouce에 .get() 방법에 내장 사용했을하지만 응답은 배열의 형태 인 .query() 기본적으로 지원됩니다.

당신은 내가 1.0.1rc3에서 나는 각-resource.js을 포함 할 것을 요구하는 $ 자원 코드를 발견 documentation on $resource here

Answer 2

확인. 그것을 해결했습니다. 첫째, 복사 나는 예 중 하나에서 발견되는 컨트롤러 추가 : 다음

function FetchCtrl($scope, $http, $templateCache) { 
     $scope.method = 'GET'; 
     $scope.url='../services/index.php'; 
     $scope.fetch = function() { 
      $scope.code = null; 
      $scope.response = null; 

      $http({method: $scope.method, url: $scope.url, cache: $templateCache}). 
      success(function(data, status) { 
       $scope.status = status; 
       $scope.data = data; 
      }). 
      error(function(data, status) { 
       $scope.data = data || "Request failed"; 
       $scope.status = status; 
      }); 
     }; 

     $scope.updateModel = function(method, url) { 
      $scope.method = method; 
      $scope.url = url; 
     }; 
    } 

을, 나는 나의 모듈 경로 컨트롤러를 추가 :

var module = angular.module('Cats', ['ngResource','Cats.filters', 'Cats.services', 'Cats.directives']) 
    .config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/main', {templateUrl: 'partials/partial1.html', controller: MyCtrl1}); 

마지막으로, 그 partial1.htm 페이지, I 추가 :

<div ng-init="fetch()"> 
    {{data}} 
</div> 

이제 브라우저에서 해당 페이지로 이동하면 JSON에서 전체 데이터베이스가 덤프되는 것을 볼 수 있습니다. 아. 분명히 시도하는 등 더 세련된 것들이 많이 있지만 나는이 간단한 결과를 필요로하므로 소집 될 때 모델이 도착했는지를 확신 할 수 있습니다. Angular는 많은 경우 조용하게 죽기 때문에 눈에 보이는 결과가 도움이됩니다.

하나의 문제 : php 파일이 자신보다 사용자 이상으로 실행될 수 있으므로주의해야합니다. AngularJS가 구현하는 사용자의 이름을 모르지만 앱에서 사용할 수 있도록 chmod 644 index.php을 사용해야했습니다.

나는 누군가를 돕기를 바랍니다.