I’m simply trying to get the state to change to a new template after running a function on ng-change, from a selection of options.
My function runs fine once a selection is made, but the $state.go() that is called at the end of the function doesn’t actually change the state to the next state view I want to navigate to.
Below is my code (simplified). I want to select an option in “template/pages/addit/index.html”, run a function, then change state to “template/pages/addit/edit.html”.
app.js:
angular.module('starter', ['ionic','firebase'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "templates/pages/menu/index.html",
controller: 'AppController'
.state('app.addit', {
url: "/addit",
views: {
'menuContent': {
templateUrl: "templates/pages/addit/index.html",
controller: 'AddItController'
}
}})
.state('app.addit.edit', {
url: "/edit",
views: {
templateUrl: "edit.html",
controller: 'EditItController'
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/app/addit');
});
add-it-controller.js:
angular.module('starter')
.controller('AddItController', function($scope, $state, addInventory){
$scope.selectNum = function (num) {
addInventory(num) //works fine
$state.go('app.addit.edit');//doesn't actually change the state
console.log('the state is '+$state.current);
}
});
templates/pages/addit/index.html:
<label class="item item-input item-select">
<div class="input-label">
How many?
</div>
<form >
<select ng-change='selectNum(num)' ng-model="num" required>
<option value='1' selected>1</option>
<option value='2' >2</option>
</select>
</form>
</label>