$location.path("/")不能正常工作

Question

当我尝试使用 $location.path() 时，URL 发生了变化，但是我传递给 .path 的任何内容都会附加到当前 URL 上。 我希望当我执行 addShow() 函数时，能够转到 index.html 页面，这是我的主页。 请帮忙解决。 URL 的更改如下： http://localhost:8080/add 当我执行 addShow() 函数时，它会更改为： http://localhost:8080/add#/ 我希望它能够转到我的主页。

angular.module('app').controller("MainController",['$location', function($location) {
      var vm = this;
      vm.title = 'TV Show';
      vm.searchInput = '';
      vm.shows = [{
        title: 'Game of Thrones',
        year: 2011,
        favorite: true
      }, {
        title: 'Walking Dead',
        year: 2010,
        favorite: false
      }, {
        title: 'Firefly',
        year: 2002,
        favorite: true
      }, {
        title: 'Banshee',
        year: 2013,
        favorite: true
      }, {
        title: 'Greys Anatomy',
        year: 2005,
        favorite: false
      }];
      vm.orders = [{
        id: 1,
        title: 'Year Ascending',
        key: 'year',
        reverse: false
      }, {
        id: 2,
        title: 'Year Descending',
        key: 'year',
        reverse: true
      }, {
        id: 3,
        title: 'Title Ascending',
        key: 'title',
        reverse: false
      }, {
        id: 4,
        title: 'Title Descending',
        key: 'title',
        reverse: true
      }];
      vm.order = vm.orders[0];
      vm.new = {};
      vm.addShow = function() {
        vm.shows.push(vm.new);
        console.log(vm.shows);
        vm.new = {};
        $location.path("/");
      };

    }]);

我的配置函数如下：

    (function() {

  "use strict";

  angular
    .module("app")
    .config(function($routeProvider, $locationProvider) {


      //$locationProvider.html5Mode(true);

      $routeProvider
        .when('/', {
          templateUrl: 'list.html',
          controller: 'MainController',
          controllerAs: 'main',
        })
        .when('/add', {
          templateUrl: 'add.html',
          controller: 'MainController',
          controllerAs: 'main',
        })
        ;

    });
})();

- vishesh

Answer 1

尝试将$location.path("/");替换为$window.location.href = "/";。

- pokaxperia

---

嗨...它没起作用。我的项目在Plunkr上。链接是http://plnkr.co/edit/0z6ng0?p=preview你能在这里检查一下吗？ - vishesh

我收到了这个错误。{ "statusCode": 400, "error": "错误的请求", "message": "previewId子项失败，因为[previewId是必需的]", "validation": { "source": "params", "keys": [ "previewId" ] } } - vishesh

Answer 2

你需要为你的应用程序提供一个基础 URL，因为当你调用路径方法时，Angular 将 'http://localhost:8080/add' 视为应用程序的基础 URL，因此无法正确工作。

在你的主 HTML 文件中指定 URL 基础。

<base href="/">

如果您想使用HTML5模式：

$locationProvider.html5Mode(true);

文件指南

例如：http://plnkr.co/edit/2EXVYKCjdKWPBd7LDEQB?p=preview

- ssskip

---

我们需要在哪里添加这个base href？我尝试在主页中添加，但出现了以下错误信息。Uncaught Error: [$injector:modulerr] 无法实例化模块 app ，原因是： Error: [$injector:nomod] 模块'app'不可用！您可能拼写了错误的模块名称或忘记加载它。如果要注册模块，请确保指定依赖项作为第二个参数。 - vishesh

Answer 3

我看了你的 Plunkr (plnkr.co/edit/0z6ng0?p=preview)，问题出在你导航到添加页面的方式上。这一行 - a href="./add.html" 直接将页面重定向到 add.html。相反，应该在控制器中使用一个函数来改变位置到 "/add"。

main.ctrl.js（控制器）：（添加此函数）

vm.newShow = function() {
   $location.path('/add');
};

List.html:

<a href="">
      <button class="btn-primary pull-right" ng-click="main.newShow()">New Show</button>
</a>

- Pratik Bhattacharya

Answer 4

只需使用controllerAs: 'vm'，我认为它会起作用。请回复我。

- Sugyan Swain