gpt4 book ai didi

angularjs - 是否可以通过 XUL 和 AngularJS 编写 Firefox 扩展

转载 作者:行者123 更新时间:2023-12-03 08:20:11 25 4
gpt4 key购买 nike

我知道 AngularJS 是 HTML 的框架。

XUL(XML 用户界面语言)和 HTML 具有相同的底层处理(可以使用 JavaScript 和 CSS)

AngularJS 可以与 XUL 集成吗?

最佳答案

由于 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 选择器与自定义元素一起使用,必须使用 document.createElement('my-tag') 预先创建自定义元素名称,而不管 XML 命名空间如何。
    <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>

  • the compiler now transparently supports several directive syntaxes. For example while before there was just one way to use ng:include directive: . The new compiler treats all of the following as equivalent:


    <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-->

    This will give template creators great flexibility to consider the tradeoffs between html code validity and code conciseness and pick the syntax that works the best for them.



    引用文献 :
  • How does AngularJS get away with using custom HTML5 element tags and attributes?
  • Custom XUL Elements with XBL
  • Make New Tags and Widgets with XBL
  • AngularJS Guide: IE Compatibility
  • Behavior Attachment
  • AngularJS Documentation for Compile: restrict
  • XML Namespaces don't need URIs
  • RFC 2141: URN Syntax
  • urn:schemas-microsoft-com:office:office Namespace
  • 关于angularjs - 是否可以通过 XUL 和 AngularJS 编写 Firefox 扩展,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18576774/

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