मेरी PHP सेवा का उपयोग कर AngularJS को mysql से कनेक्ट करें?

Question

मैं अपने मैक पर लोकलहोस्ट के साथ AngularJS 1.0, PHP, और MySQL का उपयोग कर रहा हूं।

मेरे पास एक बहुत ही सरल mysql डेटाबेस है: "बिल्लियों"। इसमें "बिल्ली के बच्चे" नामक एक टेबल है। तालिका में दो कॉलम हैं, "आईडी" और "नाम"। लैरी, घुंघराले और मो नाम के साथ डेटाबेस में तीन बिल्ली के बच्चे हैं।

अब, मेरे पास कुछ सरल PHP कोड है जो dbase खोलता है, तीन रिकॉर्ड प्राप्त करता है, और उन्हें JSON में वापस लौटाता है: [{"id": "1", "name": "लैरी"}, {"आईडी": "2", "नाम": "घुंघराले"}, {"आईडी": "3", "नाम": "मो"}]

मैंने नवीनतम कोणीय-बीज का उपयोग किया और स्थापित किया ग्रहण में एक परियोजना। App.js में मैंने यह लिखा: 'सख्त उपयोग करें'; angular.module ('बिल्लियों', ['ngResource', 'बिल्लियों। फ़िल्टर', 'बिल्लियों। सर्विसेज', 'बिल्लियों। डायरेक्टिव्स']) मैंने अपना PHP कोड सेवा फ़ोल्डर में रखा और इसे "index.php" "। यदि मैक पर लोकलहोस्ट का उपयोग करके अपने ब्राउज़र में उस सेवा/index.php पर नेविगेट करता हूं, तो मैं ऊपर JSON वापस प्राप्त करता हूं। अब तक सबकुछ शांत है।

अब - मैं जो करना चाहता हूं (! अंतिम अंतिम शब्द;) मेरे पास मौजूद PHP सेवा से कनेक्ट है और मेरे एंगुलरजेएस प्रोजेक्ट का उपयोग करके मेरे मुख्य इंडेक्स पेज पर उस बिल्लियों की तालिका को प्रदर्शित करता है। सादा पुराना पाठ, कोई सारणी नहीं, बस उपलब्ध संसाधन से जुड़ें और इसे प्रदर्शित करें।

मैंने ऑनलाइन सभी प्रकार के डेमो की कोशिश की है (कई पुराने हैं)। क्या कोई मुझे ऐसा करने का एक सरल, वर्तमान तरीका दिखा सकता है? मेरे जीवन के लिए मेरे पास सभी प्रकार के एंगुलरजेएस डेमो काम कर रहे हैं लेकिन उनमें से कोई भी इस सरल कार्य को समझने में नहीं करता है।

अग्रिम धन्यवाद।

Answer 1

यह भी काम करना चाहिए। यह कोड की काफी कम लाइनों है, लेकिन ध्यान दें कि किसी भी त्रुटि हैंडलिंग हटा दिया गया है:

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

आम तौर पर मैं $resouce पर .get() विधि में बनाया का इस्तेमाल किया है, लेकिन आप अपनी प्रतिक्रिया किसी सरणी के रूप में है जो .query() डिफ़ॉल्ट रूप से समर्थन करता है।

आप 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 पृष्ठ पर, मैं जोड़ा इस:

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

अब जब मैं ब्राउज़र में उस पृष्ठ पर जाएं, मैं देख सकता पूरे डेटाबेस JSON में बाहर फेंक दिया। Ahhhh। जाहिर है, कोशिश करने के लिए कई और परिष्कृत चीजें हैं, इत्यादि। लेकिन मुझे इस साधारण परिणाम की आवश्यकता थी, इसलिए मैं निश्चित हो सकता था कि वास्तव में एक मॉडल सामने आया जब उसे बुलाया गया। कोणीय कई मामलों में चुपचाप मर जाता है, इसलिए एक दृश्य परिणाम काफी उपयोगी था।

एक गोचाचा: सावधान रहें कि PHP फ़ाइल उपयोगकर्ता के रूप में स्वयं से अधिक निष्पादन योग्य है। मुझे उपयोगकर्ता का नाम पता नहीं है कि AngularJS लागू करता है लेकिन मुझे chmod 644 index.php था ताकि ऐप इसका उपयोग कर सके।

मुझे उम्मीद है कि किसी की मदद करेगा।