$[removed].href is undefined with angularjs

问题:

I programme an application in ASP.NET MVC6, angularjs and Bootstap. I want reload a page after bootstrap modal closing. To do this, I use $window.location.href but it's undefined.

This is my method in angular Controller:

 angular
    .module('LSapp')
    .controller('CustomersCtrl', CustomersCtrl);

CustomersCtrl.$inject = ['$scope', '$http', '$location', '$modal', '$templateCache', '$window'];

function CustomersCtrl($scope, $http, $location, $modal, $window) {
     $scope.edit = function(id)
    {
        var customer = getCustomer(id);
        console.log('Customer => FirstName : ' + customer.FirstName);
        var reqEditCustomer = $http({ url: '/api/customers/', dataType: 'json', method: 'PUT', data: JSON.stringify(customer), contentType: 'application/json; charset=utf-8' });
        reqEditCustomer.success(function (dataResult) {
            $scope.customer = dataResult;
            $scope.cancel();       
        });
        $scope.customers = getListCustomers();
        $window.location.href = '/';
    }
}

All runs except the redirection.

I hope someone can help me . Any help is welcome.

回答1:

you can use

$location.path('/');

instead of

$window.location.href = '/';

回答2:

Try This -

$location.path('/').replace();
if(!$scope.$$phase) $scope.$apply()

回答3:

I tried to redirect since a view and not a modal. It's work. So I think it's redirect with my modal who create problem.

It's my full controller:

(function () {
'use strict';

angular
    .module('LSapp')
    .controller('CustomersCtrl', CustomersCtrl)
    .controller('CustomersGetCtrl', CustomersGetCtrl);

CustomersCtrl.$inject = ['$scope', '$http', '$location', '$modal', '$templateCache', '$window'];

function CustomersCtrl($scope, $http, $location, $modal, $window) {
    /*---------------------------------------------------------------------------------
     *                      Obtain Customer List
     *--------------------------------------------------------------------------------*/
    function getListCustomers()
    {
        var reqCustomers = $http.get('/api/Customers');
        reqCustomers.success(function (dataResult) {
            $scope.customers = dataResult;
        });

        return $scope.customers;
    }
    getListCustomers();
    /*---------------------------------------------------------------------------------
     *                      Obtain Customer by ID
     *--------------------------------------------------------------------------------*/
    function getCustomer(id) {
        var reqGetCustomer = $http({ url: '/api/customers/' + id, method: 'GET' });
        reqGetCustomer.success(function (dataResult) {
            $scope.customer = dataResult;
        })
        return $scope.customer;
    }

    $scope.edit = function(id)
    {
        var customer = getCustomer(id);
        console.log('Customer => FirstName : ' + customer.FirstName);
        var reqEditCustomer = $http({ url: '/api/customers/', dataType: 'json', method: 'PUT', data: JSON.stringify(customer), contentType: 'application/json; charset=utf-8' });
        reqEditCustomer.success(function (dataResult) {
            $scope.customer = dataResult;
            $scope.cancel();       
        });
        $scope.customers = getListCustomers();
        //This is that I tried to redirect
        //$window.location.href = '/';
        //$location.path('/').replace();
        //if(!$scope.$phase) $scope.$apply
    }

    /*---------------------------------------------------------------------------------
    *                      Manage Customer Details Modal
    *--------------------------------------------------------------------------------*/
    $scope.openDetails = function (id) {
        var modalInstance = $modal.open({
            templateUrl: 'Modals/Customers/details.html',
            controller: $scope.modalDetails,
            resolve: {
                id: function () {
                    return id
                }
            }
        });
    }

    $scope.modalDetails = function($scope, $modalInstance, id)
    {
        if (angular.isDefined(id)) {
            var reqGetCustomer = $http({ url: '/api/Customers/' + id, method: 'GET' });
            reqGetCustomer.success(function (dataResult) {
                $scope.customer = dataResult;
            });
        } else { alert('id is undefined'); }

        $scope.cancel = function () {
            $modalInstance.dismiss('cancel');
        }
    }

    /*---------------------------------------------------------------------------------
    *                      Manage Customer Edit Modal
    *--------------------------------------------------------------------------------*/

    $scope.openEdit = function (id) {
        var modalInstance = $modal.open({
            templateUrl: 'Modals/Customers/edit.html',
            controller: $scope.modalEdit,
            resolve: {
                id: function () {
                    return id
                }
            }
        });
    }

    $scope.modalEdit = function ($scope, $modalInstance, id) {
        if (angular.isDefined(id)) {
            var reqGetCustomer = $http({ url: '/api/Customers/' + id, method: 'GET' });
            reqGetCustomer.success(function (dataResult) {
                $scope.customer = dataResult;
            });
        } else { alert('id is undefined'); }

        $scope.cancel = function () {
            $modalInstance.dismiss('cancel');
        }
    }
}

//Controller to redirect since View
CustomersGetCtrl.$inject = ['$scope', '$http', '$routeParams', '$window'];

function CustomersGetCtrl($scope, $http, $routeParams, $window)
{
    function getCustomer()
    {
        var reqGetCustomer = $http({ url: '/api/customers/' + $routeParams.id, method: 'GET' })
        reqGetCustomer.success(function (dataResult) {
            $scope.customer = dataResult;
        })
    }
    getCustomer();

    $scope.edit = function () {
        $window.location.href = '/';
    }
}
})();

回答4:

I solved the problem by using ui.router instead of ng -router.