single-page-application

Tell screen reader that page has changed in Backbone/Angular single-page app

六眼飞鱼酱① 提交于 2019-11-27 12:13:00
Imagine you have a simple, single-page application - regardless of whether it was written using Backbone, Angular, Ember or anything else. How can you tell a screen reader that we've changed 'page' when a route is followed? In a classic application, when I navigate from /index.html to /about.html the screen reader obviously detects the page change, and re-reads as you'd expect. In my Backbone application though, when I follow a route I cannot work out how to trigger a 're-read'. I've tried triggering a focus event which I'd seen somewhere, but that doesn't seem to work. Note: I'm currently

How to force update Single Page Application (SPA) pages?

谁说我不能喝 提交于 2019-11-27 10:07:48
问题 In fully server side based rendering (non Web 2.0), deploying server side code would directly update client side pages upon page reload. In contrast, in React based Single Page Application, even after React components were updated, there would be still some clients using old version of the components (they only get the new version upon browser reload, which should rarely happen) -> If the pages are fully SPA, it's possible that some clients only refresh the pages after a few hours. What

single page application with angularjs and facebook share button

爷,独闯天下 提交于 2019-11-27 09:38:18
问题 I follow this post to deploy facebook share botton in my app http://www.hyperarts.com/blog/tutorial-how-to-add-facebook-share-button-to-your-web-site-pages/ The first problem is I can not pass post.id , post.caption to facebook script. The second one is the link to every post on facebook wall link: ' link to every {{post.id}}' . If people click on a link shared on their wall, it should jum (AUTO SCROLL) to specific post on my site, this is single page so all post have the same link Thanks so

How can I use cshtml files with Durandal?

自闭症网瘾萝莉.ら 提交于 2019-11-27 06:46:18
I got the DurandalJS StarterKit template on VS2012... All works great... But in some views I need to do something like that: @if (Roles.IsUserInRole("Administrators")) { <p>Test</p> } However with durandal all my views are '.html' files... Is that possible to use '.cshtml' files to access some information like that? Or is there any other way to do that with durandal? Junior Yes, you can absolutely use cshtml files with Durandal and take advantage of Razor on the server. I assume that also means you want MVC, so you can do that too and use its routing. If you don;t want the routing then you can

How would I have ui-router go to an external link, such as google.com?

萝らか妹 提交于 2019-11-27 04:46:23
For example: $stateProvider .state('external', { url: 'http://www.google.com', }) url assumes that this is an internal state. I want it to be like href or something to that effect. I have a navigation structure that will build from the ui-routes and I have a need for a link to go to an external link. Not necessarily just google, that's only an example. Not looking for it in a link or as $state.href(' http://www.google.com '). Need it declaratively in the routes config. Angular-ui-router doesn't support external URL, you need redirect the user using either $location.url() or $window.open() I

how to embed an angular app into another app?

元气小坏坏 提交于 2019-11-27 04:16:51
问题 My team develop an angular 5 application that has been in production for a while, but we've been tasked recently with making the app work in other 3 sites the company owns. One site is a SPA built with Angular6, other is also a SPA but uses Angular5, while the other is using some older libraries such as jQuery. Management wanted us to integrate with the Angular5 SPA right away so we just exported the whole application as a module with child routes and let the other application do the

Why doesn't the browser reuse the authorization headers after an authenticated XMLHttpRequest?

筅森魡賤 提交于 2019-11-27 01:45:06
问题 I'm developing Single Page App using Angular. The backend exposes REST services that require Basic authentication. Getting index.html or any of the scripts does not require authentication. I have an odd situation where one of my view has a <img> where the src is the url of a REST API that requires authentication. The <img> is processed by the browser and I have no chance to set the authorization header for GET request it makes. That causes the browser to prompt for credentials. I attempted to

Difference between [ngClass] vs [class] binding

回眸只為那壹抹淺笑 提交于 2019-11-27 01:32:23
What is the difference in Angular 2 between the following snippets: <div [class.extra-sparkle]="isDelightful"> <div [ngClass]="{'extra-sparkle': isDelightful}"> This is special Angular binding syntax <div [class.extra-sparkle]="isDelightful"> This is part of the Angular compiler and you can't build a custom binding variant following this binding style. The only supported are [class.xxx]="..." , [style.xxx]="..." , and [attr.xxx]="..." ngClass is a normal Angular directive like you can build it yourself <div [ngClass]="{'extra-sparkle': isDelightful}"> ngClass is more powerful. It allows you to

Can I use the browser Navigation Timing API for Ajax events in single page apps? If not, what's a good tool?

和自甴很熟 提交于 2019-11-27 01:09:36
问题 We've got a single page app built with Knockout and Backbone which makes Ajax calls to the server and does some complex data caching and DOM rendering. We're really like to measure the performance (and log it back to the server) as seen by the user. I can't seem to get my head wrapped around whether the browser Navigation Timing API is going to be useful for this or not. From what I see in examples, the Navigation Timing API is tied to window.performance and this is limited to the page load

AngularJS UI-Router multiple pages

青春壹個敷衍的年華 提交于 2019-11-27 01:03:09
问题 As Angular is SPA that's terrific, but what if I need some other page not related to index.html, how is realised by UI-Router states with different ui-views? For example, I have index.html : <!DOCTYPE html> <html data-ng-app="npAdmin"> <head> ... </head> <body> <header> <data-user-profile class="user-profile"></data-user-profile> </header> <section class="content-wrapper"> <aside data-main-menu></aside> <div class="main-content" data-ui-view></div> </section> <footer class="row"></footer> ...