Я использую AngularJS 1.0, PHP и mysql с localhost на моем Mac.
У меня очень простая база данных mysql: «Кошки». Он имеет одну таблицу под названием «котята». Таблица имеет два столбца: «id» и «name». В базе данных есть три котята с именами Ларри, Керли и Мо.
Теперь у меня есть простой PHP-код, который открывает dbase, получает три записи и возвращает их в JSON следующим образом: [{"id": "1", "name": "Larry"}, {"id": "2", "название": "завитые"}, { "идентификатор": "3", "название": "Мо"}]
Я использовал последнее угловое семя и создал проект в Eclipse. В app.js я написал это: «use strict»; angular.module ('Cats', ['ngResource', 'Cats.filters', 'Cats.services', 'Cats.directives']) Я поместил свой PHP-код в папку служб и назвал его «index.php». Если я перейду к этим услугам / index.php в своем браузере, используя localhost на Mac, я вернусь к JSON выше. Пока все круто.
Теперь – ВСЕ, Я ХОЧУ ДЕЛАТЬ (! Знаменитые последние слова;), подключается к сервису PHP, который у меня есть, и отображает содержимое этой таблицы Cats на моей главной странице индекса, используя мой проект AngularJS. Обычный старый текст, без таблиц, просто привязывается к доступному ресурсу и отображает его.
Я пробовал всевозможные демоверсии онлайн (многие устарели). Может ли кто-нибудь показать мне один простой, текущий способ сделать это? Для жизни у меня есть все виды демографических работ AngularJS, но ни одна из них не выполняет эту простую задачу таким образом, который я могу понять.
Заранее спасибо.
Это также должно работать. Это значительно меньше строк кода, но обратите внимание, что любая обработка ошибок была удалена:
function FetchCtrl($scope, $resource) { var services = $resource('../services/index.php'); $scope.data = services.query(); } FetchCtrl.$inject = ['$scope', '$resource'];
Обычно я использовал встроенный метод .get()
для $resouce
но ваш ответ был в виде массива, который по умолчанию поддерживается .query()
.
Вы можете найти документацию на $resource
здесь
ОК. Решил. Во-первых, скопировал и добавил контроллер, который я нашел в одном из примеров:
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. Аааа. Ясно, что есть много более сложных вещей, чтобы попробовать и т. Д., Но мне нужен этот простой результат, поэтому я мог быть уверен, что на самом деле у меня есть модель, прибывающая при вызове. Угловые умирают молча во многих случаях, поэтому видимый результат был весьма полезен.
Один из них: будьте осторожны, чтобы файл php выполнялся больше, чем вы сами. Я не знаю имя пользователя, которое реализует AngularJS, но мне нужно было chmod 644 index.php
чтобы приложение могло его использовать.
Надеюсь, это поможет кому-то.