4

I know that AngularJS is framework for HTML.

XUL(XML user interface language) and HTML have the same underlying processing (can use JavaScript and CSS)

Can AngularJS can intergrate with XUL?

4

1 回答 1

0

由于 XUL 是 XML，AngularJS 语法需要是 XML 兼容的版本：

  • id="ng-app"与ng-app属性一起添加到根元素

    <!doctype html>
<html xmlns:ng="urn:ng" id="ng-app" ng:app="optionalModuleName">
  <div my-directive="exp"></div>
...
</html>

  • 使用自定义元素标签，例如<ng:view>

  • 要使 CSS 选择器与自定义元素一起使用，无论 XML 命名空间如何，都必须使用 document.createElement('my-tag') 预先创建自定义元素名称。

    <html xmlns:ng="urn:ng">
<!-- Needed for ng namespace -->
<head>
<!--[if lte IE 8]>
<script>
// needed to make ng-include parse properly
document.createElement('ng-include');

// needed to enable CSS reference
document.createElement('ng:view');
</script>
<![endif]-->
<style>
ng\:view {
display: block;
border: 1px solid red;
}

ng\:include {
display: block;
border: 1px solid blue;
}
</style>
</head>
<body>
<ng:view></ng:view>
<ng:include></ng:include>
...
</body>
</html>

编译器现在透明地支持几种指令语法。例如，之前只有一种使用 ng:include 指令的方法：。新编译器将以下所有内容视为等效：

<ng:include src="someSrc"></ng:include> <!-- XHTML element-->
<div ng:include src="someSrc"></div><!-- XHTML attribute-->
<div ng:include="someSrc"></div><!-- XHTML attribute shorthand -->

<div data-ng-include src="someSrc"></div><!-- data attribute-->
<div data-ng-include="someSrc"></div><!-- data attribute shorthand-->

<ng-include src="someSrc"></ng-include> <!-- Expando Element -->
<div ng-include src="someSrc"></div><!-- Expando Attribute-->
<div ng-include="someSrc"></div><!-- Expando attribute shorthand-->

<x-ng-include src="someSrc"></x-ng-include> <!-- Mozilla X-Tag -->

<div class="ng-include: someSrc"></div><!-- Class property-->

这将为模板创建者提供极大的灵活性，以考虑 html 代码有效性和代码简洁性之间的权衡，并选择最适合他们的语法。

参考资料：

于 2014-04-01T23:00:04.667 回答