Angular 在 XML 命名空间中不会通过 ng:app 自动 bootstrap

Question

我知道由于与 IE 的向后兼容性，Angular 允许使用 xmlns 并使用 ng: 而不是 ng-，但是它似乎不起作用xhtml

中的所有指令

<?xml version="1.0"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ng="http://angularjs.org">
  <head>
    <title>Test</title>
  </head>
  <body ng:app="MyApp">
    <div ng:controller="FooController as foo">
      <p>{{foo.text}}</p>
    </div>
    <script src="angular.min.js" />
    <script>
      var app = angular.module("MyApp", []);
      app.controller("FooController", function () {
        this.text = "Hello Angular!";
      });
    </script>
  </body>
</html>

以上只会产生 {{foo.text}}，但如果我用 ng-app 替换 ng:app（保持 ng:controller 不变）一切正常。我真的很喜欢使用名称空间的一致性，那么为什么 ng:app 不起作用？

Answer 1

您的示例运行良好。看看这里：http://plnkr.co/edit/mgUMZe09FSr1aALE6ddd?p=preview

可能您的 angular script 没有正确包含

<script/> 应该是 <script></script> 它不会自动关闭 html 标签

Answer 2

由于以下原因，ng:app 语法不起作用：

The elements contained within the template are always created in the HTML namespace. Whilst this is probably fine for the fast majority of cases if someone ever uses AngularJS with another XML document like SVG this could cause some problems.

参考资料

Angular 在 XML 命名空间中不会通过 ng:app 自动 bootstrap

Angular in an XML Namespace does not auto bootstrap via ng:app

xhtml

backwards-compatibility

xml-namespaces

angularjs

ng-app