Я новичок в AngularJS и до сих пор учился, но я не рассматривал этот вопрос нигде на этом сайте. Я создаю традиционный веб-сайт html / php list, который передает данные, такие как идентификатор списка с индексной страницы, на страницу списка ( listr.npctimes.com ).
После некоторого начального воспроизведения с angularJS я понял, что это сила в одностраничном веб-приложении, поэтому я перестала пытаться поместить его на весь сайт и хочу создать веб-приложение для пользователя, чтобы изменить выбранный список на странице списка. К сожалению, я не понял, как получить идентификатор списка из данных GET в url (например, listr.npctimes.com/list.php?id=1 ) на контроллер angularJS, чтобы контроллер мог запрашивать элементы списка из конкретного списка.
PHP / HTML (с AngularJS)
<?php $list_id = $_GET['id']; ?> <div data-ng-app="listApp" data-ng-controller="listCtrl"> <ul data-ng-repeat="list in lists | orderBy:'edit_date':true"> <li> <a href="#">{{ list.name }}</a> </li> </ul> </div> Угловой контроллер JS
listApp.controller("listCtrl", function ($scope, $http) { $http.get("http://listr.npctimes.com/php/items.php?list_id=1").success(function (response) { $scope.lists = response; }); });
В настоящее время list_id жестко запрограммирован в запросе HTTP http get request в angularJS, но я хотел бы получить переменную PHP list_id в контроллере angularJS, чтобы я мог использовать его для запроса элементов из соответствующего списка для настройки веб-приложения в первом место.
Файл items.php возвращает простой JSON, который выглядит как
[{"id":"1","list_id":"1","name":"Renew Truck Registratiion","create_date":"September 2, 2014 07:20 PM","edit_date":"November 30, -0001 12:00 AM","checked":"0","rank":"0","notes":""},{"id":"2","list_id":"1","name":"Rental Showing on Thursday","create_date":"September 2, 2014 07:20 PM","edit_date":"November 30, -0001 12:00 AM","checked":"0","rank":"0","notes":""}]
и могут быть загружены по адресу http://listr.npctimes.com/php/items.php?list_id=1
Что я пробовал
Я нашел пару сообщений об использовании переменной location, чтобы попытаться вытащить переменную get из URL-адреса, но всякий раз, когда я пытаюсь использовать ее, он выдает весь контроллер.
Я также попытался использовать php, чтобы установить значение скрытого элемента в HTML и вытащить его с помощью jQuery в контроллере angularJS, но это привело к «неопределенной» переменной.
Любая помощь приветствуется! Благодаря!
Вы не должны использовать <?php ... ?> Или ссылку на PHP сайт или что-то подобное в своем Angular front-end, потому что, как только вы решите использовать Angular, его значение означает, что все ваши интерфейсы построены с помощью Angular, PHP это серверный язык. Просто отправьте запрос на сервер, затем получите данные и отобразите …
Чтобы передать параметры прохождения / получения, вы можете $routeProvider .
В вашем приложении app.js :
angular.module('exampleApp', [ 'ngRoute' ]) .config(function ($routeProvider) { $routeProvider .when('/', { templateUrl: 'views/main.html', action: 'home' }) .when('/list/:itemId', { templateUrl: 'views/item.html', action: 'lists' }); });
Затем, после того как вы загрузили список на свою домашнюю страницу, вы можете установить href для каждого элемента:
<div data-ng-app="exampleApp" data-ng-controller="listCtrl"> <ul data-ng-repeat="list in lists | orderBy:'edit_date':true"> <li> <a href="#/list/{{list.id}}">{{ list.name }}</a> </li> </ul> </div>
Теперь в вашем itemCtrl вы можете обрабатывать идентификатор $routeParams поставщиком $routeParams
angular.module('exampleApp.controllers', []) .controller('itemCtrl', function ($scope, $sce, $route, $routeParams, $http){ $scope.$on("$routeChangeSuccess", function( $currentRoute, $previousRoute ){ if( $routeParams.itemId ){ // use http to get the item which has id = $routeParams.itemId } }); });
Надеюсь, что эта помощь, любые проблемы, которые вы можете опубликовать в качестве комментария