Ben Clarke Ben Clarke - 5 months ago 22
AngularJS Question

load another partial if value returned is true


I have a email box where a user enters their email which to then I make a web service call to check the email exists inside my controller. I want to them move to a partial called forgotpasswordcode.html if the email exists.


Here is the page where the user enters their email:

<div id="forgotpasswordWrapper" ng-controller="forgotPasswordController">
<div class="container-fluid">
<div class="row">
<form name="forgotpasswordForm" autocomplete="off" class="text-center col-xs-12 col-sm-6 col-sm-offset-3 col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4">
<div class="col-lg-12">
<img src="images/logo.png" />
<div class="col-lg-12">
<input id="email" name="email" type="email" required placeholder="Email" ng-model="email">
<div class="col-lg-12">
<button type="submit" ng-click="forgotpasswordForm.$valid && ResetPassword()">
<span>Reset Password</span>

The button then points to the controller here:

app.controller('forgotPasswordController', function ($scope, forgotPasswordService) {

$scope.ResetPassword = function () {
//REDIRECT TO PARTIAL forgotpasswordcode.html

I do have a routing engine set up like below:

app.config(function ($routeProvider) {

.when('/', { templateUrl: 'partials/login.html', controller: 'loginController'})

.when('/forgotpassword', { templateUrl: 'partials/forgotpassword.html', controller: 'forgotPasswordController' })

.when('/forgotpasswordcode', { templateUrl: 'partials/forgotpasswordcode.html', controller: 'forgotPasswordCodeController' })


How can I load another partial from my controller?


Use $location service