Angular.js更改位置ng-click

Question

I've read some other posts on the same topic but cannot get my own to work. Basically, I want the location of my app to change on a ng-click event. So I have html code that looks like this:

<button class="button icon-left ion-plus-round button-block button-calm" ng-click="send({{foods.cal}})">
    Add Calories
</button>

And a controller that looks like this:

.controller('foodDetailCtrl', function($scope, $stateParams, $location, foods) {
$scope.foods = foods.get($stateParams.foodsId);

$scope.send = function(i) {
// do something with 'i'

$location.path('/calc');

}

})

But when I click on my html button the location gets refreshed to a home tab as if it cannot find '/calc'. I've tried calc preceeded by parents folders and followed with file extension but cannot get this to work. Any help massively appreciated.

Answer 1

try this

in your html

ng-click="send($event, foods.cal)"

controller

$scope.send = function(event, i) {
event.preventDefault();
// do something with 'i'

$location.path('/calc');

}

you could also try using $state

instead of $location.path('/calc') use $state.go('tab.calc')

Answer 2

Try this:

app.config(function($routeProvider) {
    $locationProvider.html5Mode(true);
});

And try adding a base tag to your html head. http://www.w3schools.com/tags/tag_base.asp