演示

Question

我搜索了解决方案，但我没有找到答案。我的问题是什么，在我的类别视图中我有init函数，它发出http请求并从数据库中获取所有类别。我使用那些记录并制作ng-repeat。但是当我打开modal with form来创建新类别时，我无法在模态关闭时更新ng-repeat视图并查看新类别。我以这种方式组织我的控制器，服务和视图：

视图

<div class="row main-body no-padding" ng-init="adminCtr.initCategory()">

    <div class="col-lg-4 margin-bottom-20" ng-repeat="category in adminCtr.allCategories">
        <div class="header-panel">
            <span class="category-headline">{{category.name}}</span>
        </div>
        <div class="main-form">
            {{category.id_cat}}
        </div>
    </div>

</div>

控制器：

function addCategory() {
        $mdDialog.show({
            templateUrl: 'app/views/modal/addCategory.html',
            clickOutsideToClose: false,
            controller: 'adminController',
            controllerAs: 'adminCtr'
        });
    }

    function initCategory() {
        adminService.initCategory().then(function (data) {
            vm.allCategories = data.categories;
        })
    }

    function createCategory(category) {
        adminService.createCategory(category).then(function (data) {
            if(data.success == false) {
                vm.categoryError = data.error;
            } else {
                vm.categoryError = '';
                cancelModal();
                initCategory();
                $location.path('/admin/category');
                $timeout(function () {
                    $mdToast.show(
                        $mdToast.simple()
                            .textContent('Kategorija je uspešno kreirana')
                            .position('top right')
                            .theme("success-toast")
                            .hideDelay(5000)
                    );
                }, 500);
            }
        })
    }

    function cancelModal() {
        $mdDialog.hide();
    }

服务：

function createCategory(category) {
        return $http.post('api/admin/createCategory', {
            category: category,
            idUser: $rootScope.globals.currentUser.idUser,
            token: $rootScope.globals.currentUser.token
        }).then(function(response) {
            return response.data;
        });
    }

    function initCategory() {
        return $http.post('api/admin/getAllCategories', {
            idUser: $rootScope.globals.currentUser.idUser,
            token: $rootScope.globals.currentUser.token
        }).then(function(response) {
            return response.data;
        });
    }

我试图再次调用init函数来更新vm.allCategories但没有任何成功。

有没有人知道解决方案？

P.S。我尝试使用$ scope.apply（），但是我得到了错误，顺便说一句，我使用的是角1.6.2。

Answer 1

在服务中删除承诺。您正在使用promise在控制器中缓存响应。所以需要在服务中添加一个承诺。

 function initCategory() {
        return $http.post('api/admin/getAllCategories', {
            idUser: $rootScope.globals.currentUser.idUser,
            token: $rootScope.globals.currentUser.token
        }) 
  }

在像这样的控制器更新中

function initCategory() {
        adminService.initCategory().then(function (res) {
            vm.allCategories = res.data.categories; // in the response data comes inside data property. 
        })
}

Answer 2

更改您的HTML模板，如下所示：

I=imread('autumn.tif');
B=1/prod(size(I))* sum(I(:))
contrast = sqrt(1/prod(size(I))*sum(power((I(:)-B),2)))

和你的JS

<div class="col-lg-4 margin-bottom-20" ng-repeat="category in adminCtr.allCategories track by category.id_cat">

演示

＆＃13;

function initCategory() {
    adminService.initCategory().then(function(data) {
        $scope.$evalAsync(function(){
            vm.allCategories = data.categories;
        });
    })
}

＆＃13;

angular.module('myApp', []);

angular
  .module('myApp')
  .controller('MyController', MyController);

MyController.$inject = ['$scope', '$timeout'];

function MyController($scope, $timeout) {
  var vm = this;
  var a = [{
    "id_cat": "1",
    "name": "fgfdgfd"
  }, {
    "id_cat": "2",
    "name": "dfgfdgdf"
  }, {
    "id_cat": "3",
    "name": "dfgfdgdffdgdfg"
  }];
  var b = [{
    "id_cat": "1",
    "name": "fgfdgfd"
  }, {
    "id_cat": "2",
    "name": "dfgfdgdf"
  }, {
    "id_cat": "3",
    "name": "dfgfdgdffdgdfg"
  }, {
    "id_cat": "4",
    "name": "dfgfdgdfg"
  }, {
    "id_cat": "5",
    "name": "dfdsfsdfsdfsd"
  }, {
    "id_cat": "6",
    "name": "sdfdsfsdfsdfsdfsd"
  }, {
    "id_cat": "7",
    "name": "dfgfdgfgfgfdgdf"
  }];
  vm.allCategories = a;

  $timeout(function() {
    $scope.$evalAsync(function() {
      vm.allCategories = b;
    });

  }, 2000);
}

＆＃13;

AngularJS从http请求更新ng-repeat中的数据

2 个答案:

演示