Невозможно отобразить данные страницы 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 не служит никакой цели.

Если бы вы могли установить планку, я мог бы помочь вам.

Другие вопросы по тегам