calilonghorn calilonghorn - 5 months ago 95
AngularJS Question

Uncaught Error: [$injector:modulerr] Failed to instantiate module matchpoint due to:

I am getting the error message below when trying to run the ionic app after adding a new controller and html page to my existing ionic angular app. I've been debugging this for a few hours now and am stuck.


ionic.bundle.js:8895 Uncaught Error: [$injector:modulerr] Failed to
instantiate module matchpoint due to: Error: [$injector:modulerr]
Failed to instantiate module settings.controller due to: Error:
[$injector:nomod] Module 'settings.controller' is not available! You
either misspelled the module name or forgot to load it. If registering
a module ensure that you specify the dependencies as the second
argument.


I have made sure to add the 'settings.controller' as a dependency to my module definition in the app.js file.

app.js file

(function() {

var matchpoint = angular.module('matchpoint', [
'ionic','ionic.service.core',

// Dashboard
'dash.controller',

// Authentication - Registration / Login
'auth.controller',
'auth.service',

// Matches
'match.controller',

// Friends and Groups
'friends.controller',
'friends.service',
'groups.service',

// Communication
'chat.controller',
'chat.service',
'email.service',

// Settings
'settings.controller',
...


settings.controller.js file

(function() {

var app = angular.module('settings.controller', []);

app.controller('SettingsController', ['$scope', 'authService', 'jsonService', 'config', 'utilityService', '$state', '$localStorage', 'friendsService', '$ionicPopup', 'mixpanelService', function($scope, authService, jsonService, config, utilityService, $state, $localStorage, friendsService, $ionicPopup, mixpanelService) {

}]);

});


settings.html

<ion-view view-title="Settings" class="settings-view">

<ion-nav-bar class="bar-dark">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>

<ion-content>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label">{{ passwordLabel }}</span>
<input type="password" placeholder="{{ passwordPlaceholder }}" ng-model="user.oldPassword">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">New Password</span>
<input type="password" placeholder="Your new password" ng-model="user.newPassword">
</label>
</div>
<div class="padding">
<button class="button button-block button-positive" ng-click="done()">
Done
</button>
<div class="error" ng-if="errorMessage" ng-bind="errorMessage">
</div>
<div class="error password-strength-error" ng-if="!passwordValid">
Password must:
<ul>
<li>have at least 1 uppercase letter</li>
<li>have at least 1 lowercase letter</li>
<li>have at least 1 digit</li>
<li>be at least 8 characters long</li>
</ul>
</div>
<br><br><br>
<button class="button button-stable button-block" ng-if="!isFirstPasswordChange"
ui-sref="app.dashboard">
Cancel
</button>
</div>
</ion-content>
</ion-view>

Answer

I'm not entirely sure if I should put this in a comment or an answer, but:

If you are running the ionic app with the ionic serve command, there is a good chance that you are running into a cache problem. I have run into a very similar problem. The index.html file is cached in your browser, and I'm guessing you added the reference to the settings.controller.js file in index. Try clearing your cache.

Comments