Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
187
rated 0 times [  193] [ 6]  / answers: 1 / hits: 27757  / 9 Years ago, wed, june 24, 2015, 12:00:00

This is very frustrating, Im using a mean.js yeoman generated application and can't get to seem to get angular-material up and running. I read another stackoverflow question about the issue Angularjs with material design Failed to instantiate module ngMaterial. So I updated my bower.json file and ran a bower update and bower install. It still doesnt work. During the bower update, bower gave me this message Unable to find a suitable version for angular, please choose one:, but I always chose an Angular version 1.3.0 or greater.

Heres a copy of my bower.json:



{
name: colign,
version: 0.0.1,
description: Full-Stack JavaScript with MongoDB, Express, AngularJS, and Node.js,
dependencies: {
bootstrap: ~3,
angular: ~1.3,
angular-resource: ~1.3,
angular-mocks: ~1.3,
angular-bootstrap: ~0.11.2,
angular-ui-utils: ~0.1.1,
angular-ui-router: ~0.2.11,
angular-material: ~0.10.0
}
}


Heres the console error message:
Error: [$injector:modulerr] Failed to instantiate module ngMaterial due to:
Error: [$injector:nomod] Module 'ngMaterial' 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.



Angular config.js file:



'use strict';

// Init the application configuration module for AngularJS application
var ApplicationConfiguration = (function() {
// Init module configuration options
var applicationModuleName = 'colign';
var applicationModuleVendorDependencies = ['ngResource', 'ui.router', 'ui.bootstrap', 'ui.utils', 'ngMaterial'];

// Add a new vertical module
var registerModule = function(moduleName, dependencies) {
// Create angular module
angular.module(moduleName, dependencies || []);

// Add the module to the AngularJS configuration file
angular.module(applicationModuleName).requires.push(moduleName);
};

return {
applicationModuleName: applicationModuleName,
applicationModuleVendorDependencies: applicationModuleVendorDependencies,
registerModule: registerModule
};
})();


Thanks in advance for any help!


More From » angularjs

 Answers
35

Angular material, ngMaterial, has dependency on ngAria and ngAnimate as well. You would need to load them.



angular.module('ngMaterial', [ng,ngAnimate,ngAria, ...other material sub modules


You could download it from angular aria and angular animate. Use the correct version of these based on your angular version.



Also just adding the scripts in the project is not enough you need to load them in your html as well. Also load them before ng-material script.


[#66065] Tuesday, June 23, 2015, 9 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
danae

Total Points: 26
Total Questions: 97
Total Answers: 112

Location: Oman
Member since Wed, Apr 12, 2023
1 Year ago
danae questions
;