title: improper url link in angularJs
body: <p>I am working in MEAN stack. For my front-end, I am trying to render data of single item from my item list with angular. When I click the item, the URL changes to other than I have set and I don't get the data. I was able to see this only after using debugging mode. The expected link is <code>/item/:itemid</code> but I am getting <code>/item/partials/item.html</code> I have used the following files:</p>
  
  <p><strong>main.route.js</strong> (only route with problem shown)</p>
  
  <pre><code>function config($routeProvider, $locationProvider) {
  $routeProvider
      .when('/item/:itemid', {
          templateUrl: 'partials/item.html',
          controller: 'productCtrl',
          controllerAs: 'vm'
      })
      .otherwise({redirectTo: '/'});
  
      $locationProvider.html5Mode({
          enabled: true,
          requireBase: false
      }); 
  };
  </code></pre>
  
  <p><strong>myData.service.js</strong></p>
  
  <pre><code>angular
      .module('myApp')
      .service('myData', myData);
  
  function myData ($http) {
      var itemById = function (itemid) {
          return $http.get('/api/items/' + itemid);
      };
  
      return {
          itemById : itemById
      };
  }
  </code></pre>
  
  <p><strong>product.controller.js</strong></p>
  
  <pre><code>angular
      .module('myApp')
      .controller('productCtrl', productCtrl)
  
  function productCtrl($routeParams, myData) {
      var vm = this;
      vm.itemid = $routeParams.itemid;
  
      myData.itemById(vm.itemid)
          .success(function(data) {
              vm.data = { item : data };
              vm.pageHeader = {
                  title: vm.data.item.name
              };
          })
          .error(function (e) {
              console.log(e);
          });
  };
  </code></pre>
  
  <p><strong>items.html</strong> (link to single item page)</p>
  
  <pre><code>&lt;a href='/#/item/{{ item._id }}'&gt;{{ item.name }}&lt;/a&gt;
  </code></pre>
  
  <p><strong>item.html</strong></p>
  
  <pre><code>&lt;div  ng-controller='productCtrl'&gt;
      &lt;div class='container'&gt;
          &lt;page-header content='vm.pageHeader.title'&gt;&lt;/page-header&gt;   
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Forgive me if the question doesn't make much sense as I am new to this. Thanks in advance!</p>