Невозможно отобразить данные страницы angularjs после изменения маршрута.
Я относительно новичок в angularjs и, кажется, здесь мне не хватает чего-то очевидного. Я пытался просмотреть документацию и руководства, но не смог найти решение своей проблемы.
У меня есть служба REST по адресу "localhost:8080/app/rest/schools/{schoolId}/selectedindicators". Я могу отобразить результаты на странице приложения angularjs (selectedindicator.html) следующим образом:
<tbody>
<tr ng-repeat="selectedindicator in selectedindicators">
<td>{{selectedindicator.id}}</td>
<td>{{selectedindicator.school.name}}</td>
<td>{{selectedindicator.userId}}</td>
<td>{{selectedindicator.dateVisit}}</td>
<td>
<button type="submit"
ng-click="update(selectedindicator.id)"
class="btn">
<span class="glyphicon glyphicon-pencil"></span> Edit
</button>
</td>
</tr>
</tbody>
До этого момента все работает нормально. Но, когда я пытаюсь выбрать один из выбранных индикаторов, нажав кнопку "Редактировать", я не могу отобразить данные на странице "Редактировать (selectedindicatorForm.html)". Вот кусок моей страницы редактирования.
<div>
<div class="form-group">
<label>ID</label> <input type="text" class="form-control" name="id"
ng-model="selectedindicator.id" required>
</div>
.
.
.
.
.
.
</div>
Вот мой код routeProvider:
myApp
.config(['$routeProvider', '$httpProvider', '$translateProvider',
function ($routeProvider, $httpProvider, $translateProvider) {
$routeProvider
.when('/selectedindicator', {
templateUrl: 'views/selectedindicators.html',
controller: 'SelectedIndicatorController',
resolve:{
resolvedSelectedIndicator: ['SelectedIndicator', function (SelectedIndicator) {
return SelectedIndicator.query();
}]
}
})
.when('/selectedindicatorForm',{
templateUrl: 'views/selectedindicatorForm.html',
controller: 'SelectedIndicatorFormController',
})
}]);
Вот мой код контроллера для метода обновления:
myApp.controller('SelectedIndicatorController', ['$scope', '$location', '$route','resolvedSelectedIndicator', 'SelectedIndicator',
function ($scope, $location,$route, resolvedSelectedIndicator, SelectedIndicator) {
$scope.selectedindicators = resolvedSelectedIndicator;
$scope.update = function (id) {
$scope.selectedindicator = SelectedIndicator.get({id: id});
$location.path("/selectedindicatorForm");
};
}]);
3 ответа
Это видео урок должен помочь. Попробуйте: https://www.youtube.com/watch?v=5uhZCc0j9RY&feature=youtu.be
Есть ли какая-то причина, по которой вы переходите с помощью $ location.path?
То, как я это сделаю, это просто положить или что-то, с class="btn" или другим стилем CSS, если вы действительно хотите, чтобы он выглядел как кнопка. С обычным ngRoute вы просто работаете с URL-адресами и должны поместить все состояния в URL-адрес. Я уверен, что установка переменной $scope и последующее ручное изменение состояния на самом деле ничего не делают, так как новое состояние имеет свою собственную область $.
Чтобы быть совершенно откровенным после просмотра этого кода, я скажу, что вы, вероятно, должны прочитать некоторые угловые учебные материалы. Я обнаружил, что egghead.io сам по себе очень хорош.
Вы можете добавить отдельный сервис (одноэлементный объект) для передачи данных между контроллерами.
похож на тебя SelectedIndicator
(который передается на SelectedIndicatorController
) уже делает это, и вы можете просто повторно использовать его.
На ваше SelectedIndicatorFormController
внедрить эту услугу SelectedIndicator
и позвонить SelectedIndicator.get({id: id});
Примечание - выглядит как эта строка $scope.selectedindicator = SelectedIndicator.get({id: id});
внутри SelectedIndicatorController
не служит никакой цели.
Если бы вы могли установить планку, я мог бы помочь вам.