angular js：在 ng-click 之后重新加载页面答案

【问题标题】：angular js: reload a page after and ng-clickangular js：在 ng-click 之后重新加载页面
【发布时间】：2017-04-09 09:22:05
【问题描述】：

我在后端使用弹簧靴，在前端使用 Angular。在我背后，我有一个 restful 服务，当用户调用定义的路由时，它会获取排序数据，然后将结果发送到前面。

在 Angular 中，我在这条定义的路线上提供了服务，我正在解析结果以将它们呈现到视图中。一切正常，除了我想在用户单击开始我的批处理的按钮后重新加载页面。在这个按钮上，我已经有一个ng-click，它可以工作并开始我的批处理。但是我不知道单击此按钮后如何重新加载页面。也许我不应该在ng-click 中使用其他函数？

我的服务：

(function() {
'use strict';
angular
    .module('pfja')
    .factory('Publication', Publication);

Publication.$inject = ['$http'];

function Publication ($http) {
    var urlOpeFlexFactureValide = 'api/invoice/valid-invoice';

    var getAllValidInvoice= function(){
        return $http.get(urlValidInvoice).then(
            function(result){
                return result.data;
            }
        );
    };

    return {
        getAllValidInvoice: getAllValidInvoice
    };
}
})();

我的 state.js：

          parent: 'app',
        url: '/publication?page&sort&search',
        data: {
            authorities: ['ROLE_USER'],
            pageTitle: 'home'
        },
        views: {
            'content@': {
                templateUrl: 'app/batch/publication/publication.html',
                controller: 'PublicationController',
                controllerAs: 'vm'
            }
        },           
         params: {
            page: {
                value: '1',
                squash: true
            },
            sort: {
                value: 'id,asc',
                squash: true
            },
            search: null
        },
            resolve: {
           ....
            validInvoiceList: ['Publication', '$q', function(Publication, $q){
                return Publication.getAllValidinvoice();
            }]

我的控制器：

(function() {
'use strict';

angular
    .module('pfja')
    .controller('PublicationController', PublicationController);

PublicationController.$inject = ['$scope',... 'Publication', 'validInvoiceList'];

function PublicationController ($scope, ..., Publication, validInvoiceList) {
    var vm = this;
    ...

    vm.validInvoiceList = validInvoiceList;

    function runPublicationBatch(){

        var invoice = new Array();
            if (vm.validInvoiceList) {
            vm.validInvoiceList.forEach(function(inv) {
                if (inv.selected) {
                    invoice.push(inv);
                }
            });
        }
         ManualBatch.runPublicationBatch(invoice);       

    };

我的html：

        <button ng-click="vm.runPublicationBatch()" class="btn btn-primary btn-md">
                <span class="glyphicon glyphicon-play-circle"></span>

                    Start
                </span>
            </button>

//my ng-repeat with vm.validInvoice...

【问题讨论】：

标签： angularjs

【解决方案1】：

您首先需要注入服务$window，然后才能使用

$window.location.reload();

       function runPublicationBatch(){
         $window.location.reload();
            var invoice = new Array();
                if (vm.validInvoiceList) {
                vm.validInvoiceList.forEach(function(inv) {
                    if (inv.selected) {
                        invoice.push(inv);
                    }
                });
            }
             ManualBatch.runPublicationBatch(invoice);       

        };

或者当你想重新加载页面时。

您可以使用$route 、$state 服务here 重新加载

【讨论】：

【解决方案2】：

如果您使用的是 $routeProvider，请在 ng-click 函数中添加 $route.reload()

或

如果您使用的是 $stateProvider，请在 ng-click 函数中添加 $state.reload('state.name')

注意：基本上重新加载整个页面并不是最佳做法。所以尝试避免重新加载

【讨论】：

重新加载是暂时的，最后我会刷新我的表。谢谢你的建议