I'm using angular 7 projects with universal integrated to it working around virtual scroll feature and am getting the following error(for server-side rendering)
ReferenceError: window is not defined
at new VirtualScrollerComponent (/sample/universal/dist/server.js:150466:23)
at createClass (/sample/universal/dist/server.js:26257:20)
at createDirectiveInstance...
Any idea on how to handle this?
Related
I have an Umbraco project which is using the built-in membership functionality (including the default login/register views) and in modern browsers everything works perfectly.
Unfortunately, I want to support Internet Explorer 8 + 9 and I'm unable to login using these browsers; after the form data is posted, the form is reloaded with validation errors, stating 'The Username/Password field is required'.
I think this is an angular issue as opposed to a purely Umbraco one - but does anyone know of a fix for this issue?
I am building a basic Angular2 + Polymer seed application (as well as rebuilding personal site), when testing it out on mobile I ran into a few problems. I am using the Router supplied by angular2/router and have inserted a <script src="webcomponents.js_here"></script> to include webcomponents.js after angular 2.0.0-beta.7 (as I write) has been pulled in.
Simplest example I could boil it down to is reproducing the error in the Angular2 Hero tutorial. If you check this plnkr out on a mobile browser you will see that when you navigate from one view, to another and you try to go back to the previous view relying on window.history.back() as the ng2 tutorial does, you will be able to go back to the previous views but at the following costs:
The view is not loaded properly
constructor() gets called but ngInit() never gets called
If you move the service-fetching logic from ngInit() to the constructor (as I did in the plunk) to test to see if the service data is still being fetched properly, the view is still not rendered properly (makes me think there is some polyfill conflict issue stopping the structural directives (*ngFor in this case) from working and manipulating the DOM properly. To get the view to load properly and the structural directives to work again with the service fetched data, you have to navigate to that view in any other way but using the window.history. This makes natural Back/Forward button routing an issue in Angular2 apps that use Polymer. It seems that as of posting this it only happens on mobile browsers.
I am testing on an iPhone 6 plus iOS 9 (9.2) and Chrome version 48.0.2564.104
Could this be some sort of view caching or polyfill problem?
I have a web app with asp.net mvc 5 on running on iis 7.5. I have a photo upload page that I made with DropZone (a javascript ajax upload plugin). In my asp.net controller during certain errors, I return an httpstatuscode of 500 with a status description with a descriptive error. DropZone then displays this descriptive error. Everything works as it should on desktop devices, however when used on an iOS device it displays a generic "Internal Server Error" message.
I'm lost at how to troubleshoot this issue. I've placed javascript alerts throughout my javascript code to try and figure out what the issue is but that didn't reveal anything helpful. I've tried using the MIHTool ipad app and the HttpWatchBasic ipad app to try and set breakpoints but that was not helpful either.
Is there a way to remotely debug an asp.net web app from an iPad? (I have visual studio 2013 premium) Or does anyone have any ideas what may be causing a different status code to be sent?
UPDATE: It appears that iOS devices ignore any custom xhr.statusText and uses the standard default statusText (i.e. code 500 is Internal Server Error). As a work around (which I hate doing, but since this is primarily for use on company iPads I didn't have much choice) I've returned a different 500 class code for each possible exception and then in the javascript code check the status code and assign my own custom error message in the javascript code.
Quickest and easiest way to see the actual exception is to turn off custom errors in your Web.config - you'll then be able to view the actual stacktrace on the iPad.
If you'd like to be able to debug the exception, you should be able to trigger it by accessing the site from the iPad by hitting your windows development machine while running in the debugger. You'll need to configure IIS express to allow remote connections (editing application host.config), adding a urlacl, and opening the Windows firewall if necessary. There are numerous guides in setting this up online.
If you want to actually debug the JS in mobile Safari, this is possible from the Mac version of Safari - see http://webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787 for details.
This question already has an answer here:
How to change between pages using Jquery Mobile in Worklight
(1 answer)
Closed 8 years ago.
I am developing a sample mobile banking app in IBM Worklight V6.2 using the jQuery Mobile Framework. I read the Getting Started Documentation on IBM Worklight and it mentions a way to implement multi-page navigation using fragments. However, it also states that if you are using a JavaScript UI Framework, use its API's instead.
I read up on the jQuery Mobile pagecontainer method and am implementing it as below:
<li>Branch Locations</li>
However, I get the issue that the linked page loads after clicking the link but the original page then reloads. Could someone explain to me why this is happening? Is this a known issue?
I found the problem. I had a link to the
<script src="jqueryMobile/jquery.mobile-1.4.3.js"></script>
In the linked pages. That is the reason it was reinitializing the original index page.
See this project for a Worklight 6.2-based app using jQuery Mobile 1.4.3's Pagecontainer widget.
In the app, you click on a button to transition from index.html to page1.html by using:
HTML
load page1
JavaScript
function changeToPage1() {
$(':mobile-pagecontainer').pagecontainer('change','page1.html');
}
You may also take a look at the following questions that are answered with explanation and project examples for using changePage.
Note that the projects may be from Worklight 6.0 and 6.1 rather than 6.2 but that does not matter as here it's about the JavaScript, simply review it.
How to change between pages using Jquery Mobile in Worklight
IBM Workligt Single HTML file containing all application pages: How to load new page?
IBM Worklight 6.1 - Why is Cordova code not working when placed in a sub-page?
IBM Worklight - Page fragmentation
IBM Worklight - Navigation errors in a multipage app
In all of them, the idea is that Worklight is a Single Page Application. Thus you cannot load another HTML file and expect the application to continue functioning. By doing so you lose the "context" of the Worklight framework - the references to the included JS files, etc.
Instead, you can use jQuery's load or jQuery Mobile's changePage (deprecated in v1.4, to be removed in v5), to load different "pages". Ample examples are provided above.
What JavaScript framework do you use successfully with Trigger.io? I mean client side JS app frameworks like backbone, knockout, ember, angular?
We use angular.js here but have some significant problems when using router for our app ... see details here https://groups.google.com/forum/?fromgroups#!topic/angular/XGDRAskA8qs .
Trigger.io and using angular.js router doesnt work together.(at least we could not get it to work)
Do you use some other JS framework you can recommend as working fine with trigger.io using application router capability? (I could see similar router feature in ember or backbone for example)
Although we don't endorse one particular library, and our goal is to be compatible with them all, I normally reach for Backbone first when starting a Trigger app. It's simple, lightweight but powerful and has a bunch of nice extensions.
Apart from the issues with Angular which we aim to have fixed as part of our next major release (probably end of July '12), we've not had reports of any snags with other libraries apart from Amber Smalltalk, which should be fixed in the same release.
We have demo apps using Backbone and Sencha here and here, and our initial demo app is written using jQuery Mobile.
I'm using jQuery, Backbonejs, Handlebars, Coffeescript, LESS as my framework - they are pretty much all from my Web development effort. Didn't have to change too much.
In fact, so far, I'm finding I have to simplify a LOT of things to get it down to a level where it fits the mobile environment.
Angular JS is one of the best contenders out there as far as JavaScript Frameworks. I ran all the way through the Angular tutorial, created a new Trigger app, and dropped in the tutorial app in place of the default scaffolding.
RAN NO PROBLEM WHAT SO EVER!!! IOS, Android, and WEB
Interestingly enough, I adapted the Angular tutorial with my own data from a server. Even works using XHR requests, and Cross Origin Resource Sharing.
In my opinion, build your app using Angular.JS + Zepto/Jquery.
Use either of those frameworks to add CSS Transitions to your app for your UI.
The reason I recommend making your own UI rather than using something like JQuery Mobile, or Sencha Touch 2 is for the past 3 days I have been doing extensive research and testing on numerouse JS Mobile UI Frameworks, and JQmobi is the only one that came close to being fast but it didnt look vary nice.
Making your own will reduce size of the app, give you full control, and keep the app running smooth..your using will never know its not native ;P