encodeUriSegment is not a function - javascript

Angular returns to console error
encodeUriSegment is not a function
it's happen when I tried call get function from angular-resource in my own controller. It's look like angular-resource can't find this one function, but it exist in angular.js file. I installed angular-resource by bower. I have everyone file path which i need in index.html.
full error message:
angular.js:13920 TypeError: [horoskopy_App Error] encodeUriSegment is not a function
at http://localhost:3000/bower_components/angular-resource/angular-resource.js:573:30

It's likely that you have a version conflict in your source. I had the same issue and found that I was using angular-resource 1.5.9 and angular 1.6. Once I had both on the same version release the issue resolved.

Related

Angular 2 Full-calendar is not a function error

I have installed full-calendar via npm and imported it to my project.It is initialized okay. But when I want to change 'events' like below it gives is not a function error. I just know that it gives this error when Jquery has been imported more than once. But as I see I have imported once and it is before angular js files. So what is the problem?
$('angular2-fullcalendar').fullCalendar('refetchEventSources',eventsUrl)

$on,$once is not defined error

Scenario is,
im using following versions of angularFire and firebase in my project in index.html
<script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script>
and angular.min.js is installed locally. IM not using AngularJS from CDN.
When I try to use $on,$once functions in my Angular project it gives me error that $on is not defined... and I am also facing error of dependency injection for using $firebaseArray,$firebaseObject even I declare firebase in my module. Here is Module declaration in my App.js file which main file and all of my controlles are in this single file
var appMainModule = angular.module('appMain', [ 'firebase','ngRoute'])
If I upgrade my versions to latest as shown in following links
[(https://www.firebase.com/docs/web/libraries/angular/quickstart.html)]
Then I face error that firebase has been removed, you may instantiate $firebaseArray,$firebaseObject directly...
Help me to solve my issues,

AngularJs Uncaught Error when deployed

I am seeing this error in AngularJS
Wierdly, it only occurs when I deploy it in Azure Cloud.
In my local instance - it doesn't occur.
Any ideas?
Update: this is the actual website
login using this sample account
sample#test.com / 1Sample
UPDATE! I suspect that this script causes the error
I dont know why the select.js fails to minify
https://github.com/angular-ui/ui-select
I actually installed the ui-select via bower command line - and then just include it manualy in the bundleconfig. Is this the issue here?
UPDATE - I pinpoint the error and seems like the config of the ui-select is the culprit
Any idea on this?
The issue is because it's getting a 404 error for this resource:
http://tradies-prototype.cloudapp.net/bundles/angular-animate.min.js.map
Make sure to include the .map files in your bundle.
EDIT:
As #CaspNZ pointed out in the comments bellow, if you have a look at this:
http://tradies-prototype.cloudapp.net/bundles/angular
you will see that you are getting this error:
/* Minification failed. Returning unminified contents.
(248,386-393): run-time error JS1019: Can't have 'break' outside of loop: break a
*/
Which means that there is something wrong with your ASP.Net MVC Bundling. It could be many things, but make sure that you are aware of this, so that your angularJs code can be minified properly.
EDIT 2
Also, have a look at this: Mvc4 bundling, minification and AngularJS services and this: http://www.codeproject.com/Tips/786205/ASP-NET-MVC-bundling-minification-with-angularjs-a

How to minify famous.angular without DI errors?

I'm running into some issues with famous-angular when minified.
A couple of the PRs I submitted yesterday were attempts to fix this, but these don't appear to have resolved the issue.
When built without minfication, everything works as expected.
When built with minification, but removing the dependency on 'famous.angular' from my app module,
the app degrades gracefully to angular only, so the layout is borked, but the underlying angular app works as expected, no errors.
When built with minification, and the app module depends on 'famous.angular',
the app does not load at all, with the following error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module famous.angular due to:
Error: [$injector:unpr] Unknown provider: t
http://errors.angularjs.org/1.2.23/$injector/u...<omitted>...2)
By employing this method,
I was able to determine which function was not getting minified correctly,
and tripping up Angular'S dependency injection:
function LocationHashbangInHtml5Url(appBase, hashPrefix) { /* ... */ }
This is in the core angular file - angular.js,
and it does indeed minify correctly in other instances.
So I am not sure why when I include 'famous.angular' in my app module,
this introduces the error.
Anyone know whaty is amiss here?
Demo of problem:
git clone git#github.com:bguiz/browserify-gulp-starter.git
cd browserify-gulp-starter
npm install famous
bower install --save angular angular-route famous-angular
# edit gulpoptions.js
# appName: 'app',
# appFolder: './src-famousangular/app/',
gulp serve-dist
I submitted these two PR's to famous-angular previously, thinking that I had caught all of the $inject scenarios:
https://github.com/Famous/famous-angular/pull/191
https://github.com/Famous/famous-angular/pull/190
Turns out that there was a third one that I had missed, and have now submitted a patch for:
https://github.com/Famous/famous-angular/pull/195
In my question above, I said function LocationHashbangInHtml5Url(appBase, hashPrefix) { /* ... */ } in angular/angular.js was the function that was not minifying correctly.
This was incorrect, and the culprit was in fact a provider in famous-angular/src/scripts/directives/fa-input.js.
For the curious, here is the process that I used to figure the above out.
As an added bonus, I happen to have discovered an additional technique to use when debugging dependency injection errors in minified AngularJs apps.
It turns out that the technique that I linked to above ( https://stackoverflow.com/a/25126490/194982 ) does not always work correctly.
What did work in the end, was to traverse up the execution stack, until we get to the invoke() function, as described in that technique. Then, instead of inspecting only fn, look in the Scope Variables tab in the the developer tools, and inspect every scope member which is a function.
This casts a wider net, and results in more things which need to be inspected;
but was necessary in this case, and I suspect might apply in others.

I am getting this error "No module: ngResource"

Trying to use the Angular $resource, and its coming back as not a method. Looking through the sparse documentation, I was able to find this :
angular.module('productServices', ['ngResource']).
That you're supposed to include it in your app module. Fair enough, I throw it in and get :
Uncaught Error: No module: ngResource
Hmm.. does this not come with Angular.js and its a separate plugin?
It's a separate file that you'll need to include in your project, as of version 1.0.0rc3 (see changelog on GitHub).
Head over to http://code.angularjs.org -- under the folder for any version after this release, you should see the angular-resource.js file available for download and inclusion in your project.

Categories