gpt4 book ai didi

angularjs - 如何结合angularjs和xhtml?

转载 作者:行者123 更新时间:2023-12-04 11:52:22 24 4
gpt4 key购买 nike

这是 angularjs 的一个最小示例,它在保存为 angular.html 时有效。 :

<!DOCTYPE html>
<html lang="en" xmlns:ng="http://angularjs.org" ng:app="">
<head>
<title>My HTML File</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>
</head>
<body>

<p>Nothing here {{'yet' + '!'}}</p>

</body>
</html>

但是我坚信 XML 并且我喜欢创建符合 XML 的所有 html 文档。我尝试修改该示例并将其另存为 angular.xhtml :

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:ng="http://angularjs.org" ng:app="">
<head>
<title>My HTML File</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js" />
</head>
<body>

<p>Nothing here {{'yet' + '!'}}</p>

</body>
</html>

最大的变化是 xhtml-Namespace 和文件扩展名“.xhtml”。没有错误或任何东西。只是页面显示为好像不存在 angular。

如何让 angularjs 使用 XML 兼容文件?

最佳答案

最好的方法之一是使用 HTML/XHTML data-属性。您可以编写有效的 HTML 和 XHTML,而无需包含任何 Angular 命名空间。这将如下所示:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" data-ng-app="">
<head>
<title>My HTML File</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js" />
</head>
<body>

<p>Nothing here {{'yet' + '!'}}</p>

</body>
</html>

当涉及到所有其他 Angular 声明时,这也是有益的,例如 ng-repeatng-show , 等等。
<div ng-repeat="item in items">{{item.name}}</div> // This won't validate.
<div data-ng-repeat="item in items">{{item.name}}</div> // This will validate.

请注意,您引导 Angular 应用程序的解决方案也是有效的 - 但这并不是您遇到的问题的真正解决方案。 (这只是加载 Angular 应用程序的一种不同方式,它恰好适用于您的情况,因为您的标记中没有任何其他 ng- 指令。)

查看类似问答 here.

关于angularjs - 如何结合angularjs和xhtml?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23185973/

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