I've been running into some probelms with my controllers and I want to make sure I'm understanding them right.
I have two buttons that are suppose to link to their controllers
<button class="button button-block button-positive" ng-click="signIn(user)">
Sign-In
</button>
<button class="button button-block button-positive" ng-click="signUp(user)">
Sign-Up
</button>
and I have two controllers in my app.js
.controller('SignInCtrl', function($scope, $state) {
$scope.signIn = function(user) {
console.log('Sign-In', user);
$state.go('welcome');
};
})
.controller('SignUpCtrl', function($scope, $state) {
$scope.signUp = function(user) {
console.log('Sign-In', user);
$state.go('welcome');
};
})
with the stateProvider being
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('signin', {
url: '/sign-in',
templateUrl: 'templates/sign-in.html',
controller: 'SignInCtrl'
})
.state('welcome', {
url: '/welcome',
templateUrl: 'templates/welcome.html'
})
$urlRouterProvider.otherwise('/sign-in');
})
Is their a reason the sign in button works and the sign up doesn't?
Assuming both of the buttons are in sign-in.html, the problem is that in your app.js you have SignInCtrl listed as sign-in's controller and SignInCtrl does not contain the signUp() method.
If both buttons are on the same page, then why not add signUp() to SignInCtrl and remove the SignUpCtrl controller?