Question

我有以下内容...

import { Component } from '@angular/core';
@Component({
    template: '<h1>Hellooooo Nurse</h1>'
})
export class TestComponent{}

和...

import 'zone.js';
import 'zone.js/dist/long-stack-trace-zone.js';
import {NgModule} from "@angular/core";
import {TestComponent} from "./TestComponent";
import { BrowserModule } from '@angular/platform-browser';
@NgModule({
    declarations: [TestComponent],
    bootstrap: [TestComponent],
    imports:[BrowserModule]
})
class Application{ }
export {Application}

最后...

const platform = platformBrowserDynamic()
const app = platform.bootstrapModule(Application)
export {app}

在我的index.html中，我有...

<html>
<head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta content="utf-8" http-equiv="encoding">
    <script src="./out/ng-demo.umd.js"></script>
</head>
<body>
    <ng-component></ng-component>
</body>
</html>

但是当我跑步时我会得到...

错误错误：选择器“ ng-component”与任何元素都不匹配

我尝试创建自定义元素，例如...

constructor(private injector:Injector){}
ngDoBootstrap() {
    const element = createCustomElement(
        TestComponent,
        {
            injector: this.injector
        }
    )
    customElements.get('ng-component') ||
    customElements.define('ng-component', element, {});
}

但是我得到...

错误：无法解析应用程序的所有参数：（？）。

Answer 1

基本上是相同的问题as this。解决方法是...

document.addEventListener("DOMContentLoaded", function(event) {
    const platform = platformBrowserDynamic()
    const app = platform.bootstrapModule(Application)
});

为什么在dom中出现“错误错误：选择器“ ng-component”与任何元素都不匹配“？

1 个答案: