gpt4 book ai didi

带无脚本的 AngularJS

转载 作者:行者123 更新时间:2023-12-05 06:46:03 24 4
gpt4 key购买 nike

我正在尝试使用 AngularJS 作为我网站的主视图来创建 SPA。我在服务器端使用 ServiceStack,因此可以根据访问它的内容干净地提供 HTML 或 JSON 请求。我主要担心的是脚本拦截器的使用,阻止 AngularJS 正确呈现页面。到目前为止,我的主要工作方式是呈现静态页面,并注入(inject)一个小脚本,如果它检测到是否启用了 Javascript,该脚本将重定向到 AngularJS 支持的页面。这很好用,因为当用户从静态页面开始时每个 URL 都工作正常,但我遇到了一些问题。

  1. 如果 JavaScript 被禁用,浏览到包含“?View=SPA”的链接会破坏页面
  2. 这会导致加载的第一个页面被加载两次。

我正在寻找替代方案,但到目前为止我还没有找到任何干净的解决方案。我正在考虑将“?View=SPA”作为一个 POST 变量,但我仍然不确定该实现。

有什么想法吗?

最佳答案

我不会重定向到其他页面,而是在同一个 HTML 文件中实现这两种情况,如下所示:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<style>.hideIfNoScript {display: none}</style>
</head>
<body ng-app ng-init="msg = 'hello world'">
<input class="hideIfNoScript" ng-model="msg" />
<p class="hideIfNoScript">{{msg}}</p>
<noscript>
<p>Content without javascript</p>
</noscript>
<script type="text/javascript">
var myEl = angular.element( document.querySelectorAll( '.hideIfNoScript' ) );
myEl.removeClass('hideIfNoScript');
</script>
</body>
</html>

head 部分中的 CSS 类 hideIfNoScript 确保在禁用 javascript 的情况下,所有具有此类的 HTML 标签都不会向用户显示。

noscript 标签显示替代内容。

如果启用了 javascript,正文部分末尾 的小脚本会使这些元素可见。在这种情况下,noscript 标签的内容是隐藏的。

关于带无脚本的 AngularJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19145041/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com