Двухстороннее связывание AngularJS v1.5.5 не работает со службой

0

Я пытаюсь получить данные об общем ресурсе с помощью ресурса с помощью угловой службы, см. Код услуги ниже:

    (function(){var app = angular.module('geoProApp');
    app.factory('project', ['$resource','$log',
        function ($resource,$log) {
            var res = $resource('http://localhost/api/project/:id', { id: '@id' }, {
                queryPaged: {
                    method: 'POST',
                    isArray: false,
                    headers: { 'Content-Type': 'application/json' },
                    url: 'http://localhost/api/project/paged',
                },
                //ignore that for now
                update: { method: 'PUT' }
            });
            var currentData = {
                totalItems:0,
                projects:[]
            };
$log.log('initial value');
            $log.log(currentData);
            return {
                queryPaged: function (params) {
                    return res.queryPaged(null, params).$promise.then(function (response) {
                        currentData.totalItems =response.total; 
                        currentData.projects=response.result;
                        $log.log('after data retrieval in service');
                        $log.log(currentData);
                        return response;
                    })
                },  
                data: currentData
            }
        }]);
}());

В контроллере, использующем службу, я хочу привязать данные, например:

app.controller('projectList', function ($scope, $state, $stateParams, $log, $http, auth, project, filter, users, bsLoadingOverlayService) {
 ....
    $scope.totalItems = project.data.totalItems;
    $scope.projects = project.data.projects;

    project.queryPaged(helpers.setPagingParams($scope.currentPage, $scope.itemsPerPage, filter)).then(function () {

        $log.log('success callback exposed by service');
        $log.log(project.data);
        $log.log('bound values')
        $log.log($scope.totalItems);
        $log.log($scope.projects);
....
    });

Однако кажется, что связанные переменные $scope.totalItems и $scope.projects никогда не обновляются, даже если служба получает новые данные, которые можно увидеть здесь:

вывод консоли

Может ли кто-нибудь указать мне в правильном направлении, что я могу потерять?

  • 0
    вы должны оставить $ scope.totalItems = project.data.totalItems; $ scope.projects = project.data.projects; внутри project.queryPaged функций.
  • 0
    Может быть, я должен объяснить далее, мое намерение состоит в том, чтобы получить данные только один раз и поделиться ими через службу между несколькими контроллерами через data возвращаемого значения. Если требуется обновление данных, я могу позвонить в project.queryPaged(..) . Все работает нормально, за исключением того, что значения, возвращаемые через data , никогда не обновляются.
Теги:
angular-services

1 ответ

0
Лучший ответ

Угловые не очень любят напрямую использовать примитивные типы данных. Двухсторонняя привязка не работает должным образом. Вместо того, чтобы устанавливать область контроллера как это

$scope.totalItems = project.data.totalItems;
$scope.projects = project.data.projects;

Вместо этого у меня будет такой объект.

$scope.model = project.data;

Прочитайте эту статью, которая объясняет, почему двухсторонняя привязка не работает с примитивными типами.

Хорошая цитата из статьи...

всегда есть. в ваших ng-моделях... Имея "." в ваших моделях будет гарантировать, что прототипное наследование находится в игре. Итак, используйте <input type="text" ng-model="someObj.prop1">

  • 0
    Я пытался, как вы предложили, результат все тот же. Object {totalItems: 0, projects: 0}
  • 0
    Попробуйте сопоставить объект данных непосредственно с моделью. Я отредактировал свой ответ.
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню