HotTowel: breeze.angular.js file missing - angularjs

I am following John Papa's course [Building Apps with Angular and Breeze - Part 1] on Plural Sight to build Breeze-Angular SPA.
I have included all references in index.html according to video.
<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>
<script src="../Scripts/breeze.to$q.shim.js"></script>
I am getting this error :
"GET http://localhost:1930/Scripts/breeze.angular.js"
When I see scripts folder, I cannot find breeze.angular.js file there.
I have tried updating and re-installing "HotTowel.Angular, HotTowel.Angular.Breeze, Breeze.Angular, Breeze.Angular.Directives" but no success.
Any suggestion where i can find this file?
Thanks in advance

"breeze.angular.js" has been renamed to "breeze.bridge.angular.js". Adding reference of "breeze.bridge.angular.js" in index.html resolved it for me.
For more information, visit http://www.getbreezenow.com/documentation/breeze-angular

Related

Don't know how AngularJS is intalled in my app and I need update it

I have an application that uses AngularJS v1.2.12 but we aren't the people that created. I've searched everywhere how to upgrade v1.2.12 to v1.7.0 but it seems that in installed in a different way.
All I've seen is "update bower.json file" or "update package.json file" but the angular folders are in "app\libs\frameworks\angular" and doesn't has any of those files...
So I don't know if I should change the version manually or run some commands, but I've installed NodeJS and Angular CLI and it throws the same error when I try "ng -update" it says that it wasn't found the package.json file.
Even in the official page I didn't found anything.
Do you have any clue about this?
I've a ViewBag.IsDebug == false that use a XXXFramework.js that seems to be inner of the solution, but in case is ViewBag.IsDebug == true it uses
<script src="app/libs/frameworks/angular/angular.min.js"></script>
<script src="app/libs/frameworks/angular/angular-animate.js"></script>
<script src="app/libs/frameworks/angular/angular-cookies.min.js"></script>
<script src="app/libs/frameworks/angular/angular-route.min.js"></script>
<script src="app/libs/frameworks/moment/angular-moment.js"></script>
<script src="//unpkg.com/angular/angular.min.js"></script>
<script src="//unpkg.com/angular-animate/angular-animate.js"></script>
<script src="//unpkg.com/angular-cookies/angular-cookies.min.js"></script>
<script src="//unpkg.com/angular-route/angular-route.min.js"></script>
<script src="//unpkg.com/angular-moment/angular-moment.js"></script>
Also be sure to read AngularJS Developer Guide - Migrating from Previous Versions.
Also
angularjs 1.6.0 (latest now) routes not working
Error with $http.get in angularJS -- Success not a Function
Why are AngularJS $http success/error methods deprecated? Removed from v1.6?
In the meantime i'm trying to start using angularjs 1.3
In that case use:
<script src="//unpkg.com/angular#1.3/angular.js"></script>
<script src="//unpkg.com/angular-animate#1.3/angular-animate.js"></script>
<script src="//unpkg.com/angular-cookies#1.3/angular-cookies.js"></script>
<script src="//unpkg.com/angular-route#1.3/angular-route.js"></script>
<script src="//unpkg.com/angular-moment/angular-moment.js"></script>
Also use angular.js instead of angular.min.js. It will enable Data Debug and provide better error messages.

Angular 2.0 Startup

I'm new to angular 2.0. Actually I'm blocked by referencing the angular related resources.
As a beginner, I would like to know which js file to reference (compiled TypeScript) in Index.html to start manipulating with Angular Js 2.0.
In the tutorial of http://angular.io I noticed several references below but I'm not sure which one shall I use in my own project. Seems none of the reference below related with Angular by looking at the names. I'm really confused now.
<script src="https://npmcdn.com/zone.js#0.6.12?main=browser"></script>
<script src="https://npmcdn.com/reflect-metadata#0.1.3"></script>
<script src="https://npmcdn.com/systemjs#0.19.27/dist/system.src.js"></script>
<script src="systemjs.config.js"></script>

How to use complete AngularJS file in your program?

Up until now I was using links to minified AngularJS files in my code, but now there is a requirement because of which I have to use complete AngularJS file. I have downloaded it from the official site, and:
<script src="../Angular/angular.js"> </script>
<script src="../Angular/angular-animate.js"></script>
<script src="../Angular/angular-aria.js"></script>
<script src="../Angular/angular-cookies.js"></script>
<script src="Angular/angular-loader.js"></script>
<script src="../Angular/angular-message-format.js"></script>
<script src="../Angular/angular-messages.js"></script>
<script src="../Angular/angular-mocks.js"></script>
<script src="../Angular/angular-resource.js"></script>
<script src="../Angular/angular-route.js"></script>
<script src="../Angular/angular-sanitize.js"></script>
<script src="../Angular/angula-scenario.js"></script>
<script src="../Angular/angular-touch.js"></script>
and this is how I added all these files in my code, but it is not working, please let me know what is the correct way of using complete AngularJS file.
Your path for angular-loader is different from the rest of your paths. I'm not sure if any of them are correct. I'd recommend starting the Chrome developer tools and then going to the Network tab to see if all of your resources are loading correctly.
Looking at your codepen it appears that you are reloading the Angular libraries later in your HTML. That is probably causing Angular to reinstantiate and therefore destroying whatever you've done in your code in between. Try deleting or commenting out the lines where you load Angular from cloudflare.

Too many import statement at home page when initializing the framework

In my angular project, I am planning to have a separate .js file for each page and a separate .js file for each service.
However, as I begin to code, I realized that I have a lot of import statement in my index.html. This would cause user having to load all the .js file even if they might not need it.
An example of the .js for my index.html
<!-- JS -->
<script src="js/vendor/angular.js"></script>
<script src="js/app/app.js" ></script>
<!-- controllers -->
<script src="js/app/controllers/roomController.js"></script>
<script src="js/app/controllers/dashBoardController.js"></script>
<!-- services -->
<script src="js/app/services/dashBoardService.js"></script>
<script src="js/app/services/roomService.js"></script>
<script src="js/app/services/chatService.js"></script>
<script src="js/app/services/videoService.js"></script>
Is there any solution to this?
It's really a best practice to have each controller, each service, each directive… in a separate file, so you're doing it in the right way.
However, as you notice, it's better for the user (and for the server!) to download a minimal number of files. Your index.html is fine for development, but in production, you must compress all your files in in one, typically with a tool like UglifyJS or YUI Compressor.
This is a known issue, especially with large projects. A viable solution is using RequireJs . You can find plenty of resources on the web about that, for instance you can try this.
I had exactly the same problem so decided to use RequireJS to allow on-demand loading of my angularJS scripts. I created a wrapper called angularAMD that hopefully can help you integrate RequireJS and AngularJS:
http://marcoslin.github.io/angularAMD/

running example"source code" from sencha website, causes error

I'm trying to modify an example in this website. I run this example on GoogleChrome, But the compiler or whatever it is, gives me the following error
"Uncaught ReferenceError: store1 is not defined".
in my browser, I type the following: localhost/helloext/index.html and I expected to see the result is, RadarFillExample as in the above mentioned website.
index.html Contains the following:
<html>
<head>
<title>Hello Ext</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/ext-debug.js"></script>
<script type="text/javascript" src="app2.js"></script>
</head>
<body></body>
</html>
app2.js Contains the sourceCode available in the above mentioned website.
And the files(index.html, app2.js and extjs directory) are located inside D:\xampp\htdocs\helloext\
Can anyone tell me how to fix this error, so that i can modify the code?
your help is appreciated
From the error message, its clear that your store named store1 is not defined.
The data store for the example comes from another file namely: example-data.js. Your application should have access to this file or you should define a store with proper data for plotting the graph.
It's been year but I faced this problem today and would like to share a solution.
Yes, you are missing the example-data.js file which is to be referenced from the HTML page. This .js file creates the data that is populated in the chart.
example-data.js can be found under extjs/examples/example-data.js. Note: extjs is the unzipped folder which you downloaded from sencha.com.

Resources