下面是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".没有任何错误或任何错误.只是页面显示为好像没有角度.
如何让angularjs使用符合XML的文件？
最好的方法之一就是使用HTML / XHTML data-属性。您可以编写有效的HTML和XHTML，而不必包含任何角度命名空间。如下所示：
<!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-repeat和）时ng-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-的标记中没有其他指令，因此碰巧适合您的情况。）
我找到了使用手动设置的解决方案。代码如下所示：
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<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 type="text/javascript">
angular.module('myApp', []);
angular.element(document).ready(function() {
angular.bootstrap(document, ['myApp']);
});
</script>
</head>
<body>
<p>Nothing here {{'yet' + '!'}}</p>
</body>
</html>
虽然目前这似乎是一个合适的解决方法，但我仍然很想知道问题是什么......
| 归档时间： |
|
| 查看次数： |
4397 次 |
| 最近记录： |