$ Location.path ("/"); not working correctly

Question

When I try to use $ location.path (), the url changes, but everything I passed in .path is added to my current url. I want that when I run my addShow () I want to go to index.html, which is my home page. Could you help me. The URL changes as follows: http: // localhost: 8080 / add and when I execute the addShow function, it changes to: http: // localhost: 8080 / add # / I want it to change to go to my home page.

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("/");
      };

    }]);

my configuration works like this:

    (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',
        })
        ;

    });
})();

Answer 1

Plunkr (plnkr.co/edit/0z6ng0?p=preview), , . - 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>

Answer 2

$location.path("/");       $window.location.href = "/";

Answer 3

U url , , u , angular treat 'http://localhost:8080/add ' URL- , .

URL html.

<base href="/">

, html5:

$locationProvider.html5Mode(true);

example: http://plnkr.co/edit/2EXVYKCjdKWPBd7LDEQB?p=preview

Answer 4

just use controllerAs: 'vm', I think it will work. just answer me