-1

What is the best way to make a HTML fallback via Angular?

I need something like this:

<span>{{angularText}} plain text</span>

The plain text would be a "backup" (perhaps generated by the server), in case the user doesn't have JavaScript enabled. Of course, if the user has JavaScript enabled, then I obviously don't want both to show.

inf3rno
  • 24,976
  • 11
  • 115
  • 197
user3634330
  • 43
  • 1
  • 2
  • 2
    To be honest, if you're using Angular, you're probably already making the assumption that the user has JS enabled. – Alexis King May 13 '14 at 21:36
  • Do you genuinely have a case of users that have no ability to run Javascript? – Ishan Chatterjee May 13 '14 at 21:36
  • 1
    Go to a angular demo page, turn JS off and you'll see what happens. (hint: probably nothing, depending on the page. But you'll definitely see `{{foo}}`` all over the place.) – nietonfir May 13 '14 at 21:37
  • Actually you won't see anything like that: https://angularjs.org/ It has a HTML fallback. – inf3rno May 13 '14 at 22:05
  • 1
    It is not so much about the ability, but the will to use JavaScript, actually. JavaScript is the base for the majority of [XSS attacks](https://en.wikipedia.org/wiki/Cross-site_scripting). With JavaScript enabled, [browser tracking](https://panopticlick.eff.org/) becomes far more powerful, also when using anonymity systems like Tor, JavaScript can be used to find your actual IP address and [break your anonymity](https://www.torproject.org/docs/faq.html.en#TBBJavaScriptEnabled). In my oppinion, it is a good idea to offer your concerned users at least read access without requiring JavaScript. – aef Feb 10 '15 at 11:26
  • I'm not sure why this was downvoted. It seems to be a very valid question. +1 – julealgon Dec 29 '16 at 21:25

2 Answers2

12
<span ng-bind="angularText">Default text from server</span>

?

But like the others have mentioned, why use Angular to create an app if there's a slight chance some of the intended users have JS disabled?

I suggest adding this to your site as well:

<noscript>
You do not have JS enabled.  Since this is an Angular based website, it won't do jack for you :-)
</noscript>
HaukurHaf
  • 13,522
  • 5
  • 44
  • 59
  • 2
    Well, of course it will not ... but the user will then see "Default text from server" and not the {{angularText}}. Wasn't that the whole point of the question? So the user will not see *both* the angular expression and the default static text? Honestly I don't see why my answer was downvoted :-) – HaukurHaf May 13 '14 at 21:39
  • Yes, that's exactly the point. The page should not break just because the user has disabled (or doesn't even support!) JavaScript. – user3634330 May 13 '14 at 21:40
  • 2
    @user3634330 "Doesn't support JavaScript"? Come on, guy, check the year on your calendar! – Blackhole May 13 '14 at 21:50
  • 1
    @Blackhole, believe it or not, there are still users out there that prefer to turn JS support off. – HaukurHaf May 13 '14 at 22:04
  • 1
    I, for example, browse the web with JS completely blocked by default (frequent websites are whitelisted though...). If the site has something interesting, I will temporarily allow it to run JS. This prevents unwanted ads, pop-ups, slowing down of websites, and all manner of unwanted things. I'm sure I'm not the only one, especially since temporarily allowing JS if needed is just two mouse clicks. – Juha Untinen Sep 11 '15 at 19:03
0

Inside index.html:

 <noscript>
         <h1>Your title</h1>
         <div style="somestyles...">
               Your content
           </div>
    </noscript>

If one wishes he/she can keep a skeleton of what the site supposed to have looked if js was enabled and then a request message inside to enable javascript .