Перезагрузка JSON-источника с помощью AngularJS Service - PullRequest
0 голосов
/ 27 октября 2018

Я новичок в AngularJS, и мне нужна ваша помощь для моего первого проекта.

Я хочу загрузить данные из JSON и отобразить их в таблице, используя ng-repeat, что на самом деле работает довольно хорошо.Однако я хочу разрешить пользователям перезагружать данные в таблице путем перезагрузки JSON.

Итак, сначала я загружаю страницу.Я получил JSON, и моя таблица заполнена.Затем я редактирую файл JSON и сохраняю его.Когда я нажимаю кнопку перезагрузки, данные, которые я получаю, в точности совпадают с данными, полученными при загрузке страницы.Я подумал, что это кеш, поэтому я очистил кеш браузера и установил кеш: false в запросе get, но он не работает.

Вот мой код:

var routeApp = angular.module("app", ["ui.bootstrap", "ngRoute", "ngSanitize", "ngAnimate", "routeAppControllers"]);

routeApp.config(function ($routeProvider) {
    $routeProvider
        .when("/home", {
            templateUrl: "/SCAP/scap/resources/templates/home.html",
            controller: "ctrlHome"
        })
        .when("/dgroups", {
            templateUrl: "/SCAP/scap/resources/templates/device-groups.html",
            controller: 'ctrlDeviceGroups'
        })
        .when("/templates", {
            templateUrl: "/SCAP/scap/resources/templates/templates.html",
            controller: 'ctrlTemplates'
        })
        .otherwise({
            redirectTo: '/home'
        });
});

var routeAppControllers = angular.module('routeAppControllers', []);

routeAppControllers.controller('ctrlDeviceGroups', function ($scope, groupsService) {

    $scope.dgroups = [];

    var promise = groupsService.getGroups();
    promise.then(function(data) {
        $scope.dgroups = data;
    });

    $scope.reloadJSON = function() {
        $scope.dgroups = [];
        console.log("Cleaning all data...");
        console.log("Reloading JSON");
        var promise = groupsService.getGroups();
        promise.then(function(data) {
            $scope.dgroups = data;
            console.log("New JSON loaded");
            console.log(data);
        });
    }

}).service('groupsService', function($http, $q, $sce) {

    var json_file = "json.json";
    // Add to use that because it didn't trust the domain...
    var trustedUrl = $sce.trustAsResourceUrl(json_file);
    var deferred = $q.defer();
    console.log("Loading JSON...");
    $http(
        {
            method: 'GET',
            url: trustedUrl,
            cache: false
        }).then(function(data) {
        deferred.resolve(data.data);
    });

    this.getGroups = function() {
        return deferred.promise;
    }
});

Вот HTML-код (я удалил ненужные строки):

<div ng-controller="ctrlDeviceGroups">
<button ng-click="reloadJSON()">Reload entire table</button>
<table>
<tbody>
<tr ng-repeat="item in dgroups">
    <!--TD-->
</tr>

</tbody>


</table></div>

Если у вас есть идеи о том, как перезагрузить JSON, и представление, я был бы очень признателен.Я также заметил, но это не предмет темы, что если я помещаю данные в мои $ scope.dgroups, ng-repeat не обновляется.

Заранее спасибо,

1 Ответ

0 голосов
/ 28 октября 2018

Переместить запрос GET в сервисный метод:

app.service('groupsService', function($http, $sce) {

    var json_file = "json.json";
    // Add to use that because it didn't trust the domain...
    var trustedUrl = $sce.trustAsResourceUrl(json_file);

    this.getGroups = function() {
        console.log("Loading JSON...");
        var config = {
            method: 'GET',
            url: trustedUrl,
            cache: false
        };
        return $http(config)
          .then(function(response) {
            return response.data;
        });
    };
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...