5

我有一个角度元素，带有自定义标记名 - fancy-button。如何嵌入fancy-button角度应用程序？

我尝试了以下方法，但都没有奏效-

  1. index.html/angular.json[scripts]导入并嵌入fancy-button的角元素脚本app.component.html（在角应用程序中运行的根组件）

  2. 导入的角度元素脚本app.component.html并嵌入fancy-button（app.component.html角度应用程序中运行的根组件）

谢谢

4

3 回答 3

1

，index.html我补充说：

<script type="text/javascript" src="assets/cappapproot.js"></script>

（cappapproot.js是我的 Angular Element js 的名称）

这导致了Uncaught Error: Zone already loaded.要解决此错误，pollyfills.ts我注释掉了以下行：

import 'zone.js/dist/zone';  // Included with Angular CLI.
于 2018-06-28T13:47:00.977 回答
1

最后，我设法在我的应用程序中实现了自定义元素。您应该执行以下步骤：

  1. 在angular.json您选择的项目中添加脚本文件：
    ...,
    "projects": {
        "my-awesome-project": {
        ...,
        "architect": {
            "build": {
                "options":{
                    ...,
                    "scripts": [
                        ...,
                        "[path to your awesome Element js]/[awesome-element].js"
                    ],
                    ...
                 },
             ...
         },
         ...
     }

  1. 在您的polyfills文件中包含import 'zone.js/dist/zone'; // Included with Angular CLI.在文件末尾。

  2. 在module你想包括你的Angular element，你必须CUSTOM_ELEMENTS_SCHEMA在schemas参数中添加decorator：

@NgModule({
  declarations: [...],
  imports: [
    CommonModule,
    ...
  ],
  schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
于 2021-03-18T07:55:48.760 回答
0

您确定使用正确的元素名称吗？你能发布你的组件+用法吗？

于 2018-06-20T14:15:14.220 回答