I am following every step of the way in John Papa's course, Building Apps with Angular and Breeze - Part 1. Once I got through the module entitled "Start playing at first clip Creating Vertical Slice Through Your App", I started to get breezeProvider errors.
Below please find error image, as well as datacontext. js code.
Your advice would be greatly appreciated.
-------------------------------------------
In F12 Dev Tools, the Console errors are :
Uncaught Error: Can't find breeze localhost:1772/Scripts/breeze.angular.js:90 [shell] Hot Towel Angular loaded! null
Error: [$injector:unpr] Unknown provider: breezeProvider <- breeze <- entityManagerFactory <- datacontext
[app] [CC Error] [$injector:unpr] Unknown provider: breezeProvider <- breeze <- entityManagerFactory <- datacontext
Here's my datacontext.js code :
(function () {
'use strict';
var serviceId = 'datacontext';
angular.module('app').factory(serviceId, ['common', 'entityManagerFactory', datacontext]);
function datacontext(common, emFactory) { // emFactory param refers to 'entityManagerFactory'
var EntityQuery = breeze.EntityQuery;
var getLogFn = common.logger.getLogFn;
var log = getLogFn(serviceId); // see common\logger.js
var logError = getLogFn(serviceId, 'error');
var logSuccess = getLogFn(serviceId, 'success');
var manager = emFactory.newManager(); // COMES FROM entityManagerFactory.js
var $q = common.$q;
var service = {
getPeople: getPeople,
getMessageCount: getMessageCount,
getSessionPartials: getSessionPartials
};
return service;
function getMessageCount() { return $q.when(72); }
function getPeople() {
var people = [
{ firstName: 'John', lastName: 'Papa', age: 25, location: 'Florida' },
{ firstName: 'Ward', lastName: 'Bell', age: 31, location: 'California' },
{ firstName: 'Colleen', lastName: 'Jones', age: 21, location: 'New York' },
{ firstName: 'Madelyn', lastName: 'Green', age: 18, location: 'North Dakota' },
{ firstName: 'Ella', lastName: 'Jobs', age: 18, location: 'South Dakota' },
{ firstName: 'Landon', lastName: 'Gates', age: 11, location: 'South Carolina' },
{ firstName: 'Haley', lastName: 'Guthrie', age: 35, location: 'Wyoming' }
];
return $q.when(people);
}
function getSessionPartials() {
var orderBy = 'timeSlotId, level, speaker.firstName';
var sessions;
// use Breeze to get data from back end; see datacontext() function above for init code.
return EntityQuery.from('Sessions')
.select('id, title, code, speakerId, trackId, timeSlotId, roomId, level, tags')
.orderBy(orderBy)
.toType('Session') // cast to type 'Session' (in CC.Model project)
.using(manager).execute() // communicate to back end
.then(querySucceeded, _queryFailed);
//.to$q(querySucceeded, _queryFailed); // OLD WAY: converts promise to Ang.
function querySucceeded(data) {
session = data.results;
log('Retrieved Session Partials from remote data source', sessions.length, true);
return sessions;
}
function _queryFailed(error) { // PASSED IN BY BREEZE
var msg = config.appErrorPrefix + 'Error retrieving data.' + error.message;
logError(msg, error);
throw error;
}
}
}
})();
The real problem is that 1st error: Can't find breeze
. See that breeze.angular.js
is the file that barks...
Make sure you have breeze JS file added in your index.html
:
<script src="scripts/breeze.debug.js"></script> // or breeze.min.js
<script src="scripts/breeze.angular.js"></script>
If you have it already added, make sure it comes before breeze.angular.js
like shown above.
These are breeze
JS references I have in my app:
<!-- #region Breeze -->
<script src="scripts/breeze.debug.js"></script>
<script src="scripts/breeze.angular.js"></script>
<script src="scripts/breeze.directives.js"></script>
<script src="scripts/breeze.saveErrorExtensions.js"></script>
<!-- #endregion -->