Question

在 angular 7 中，我面临以下问题，我需要将MenuWidgetComponent注入home组件，将其导入到widget组件中并通过index.ts导出。但是我还是得到了，

我用谷歌搜索，但找不到任何解决方案。我是否错过了代码中的某些内容？

角度7：错误错误：未捕获（承诺）：错误： StaticInjectorError（AppModule）[MenuWidgetComponent-> TripsMenu]：

以上错误，请帮助。

文件夹结构：

ApplicationWorkspace >
   1. GlobalApp > 
       - App > 
         - app.module
         - home Component
   2. Libs >
        - widget >
            src > 
              - MenuWidgetComponent
              - widget module
            index.ts

index.ts

export * from './lib/widgets.module';
export * from './lib/menu-widget/menu-widget.component';

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { NxModule } from '@nrwl/nx';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { WidgetsModule } from '@gp-angular-workspace/widgets';
@NgModule({
  declarations: [AppComponent, HomeComponent],
  imports: [
    BrowserModule,
    NgbModule.forRoot(),
    NxModule.forRoot(),
    AppRoutingModule,
    WidgetsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

Home.html

<div class="home" background="assets/images">
  <pfj-menu-widget></pfj-menu-widget>
</div>

widget.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { WidgetWrapperComponent } from './widget-wrapper/widget-wrapper.component';

@NgModule({
  imports: [CommonModule],
  declarations: [MenuWidgetComponent],
  exports: [ModalWidgetComponent]
})
export class WidgetsModule {}

Answer 1

这应该使您更容易解决

let methodTypes = [
  'Phone Number',
  'Name',
  'Address'
];

let homeSearchForms = [

  '<?= $this->render('/site/forms/phone_search', ['uri' => Url::to(['phone/process'])]); ?>',
  '<?= $this->render('/site/forms/person_search', ['uri' => Url::to(['people/process'])]); ?>',
  '<?= $this->render('/site/forms/address_search', ['uri' => Url::to(['address/process'])]); ?>'

];

let searchMethodOptions = document.querySelectorAll('.home-search-method-option');
searchMethodOptions = Array.from(searchMethodOptions);

function setSearchMethod() {
  for (var i = 0; i < searchMethodOptions.length; i++) {
    const searchMethodOption = searchMethodOptions[i];
    const methodType = methodTypes[i];
    const searchForm = homeSearchForms[i];

    searchMethodOption.innerHTML = methodType;

    searchMethodOption.addEventListener("click", function() {
        document.getElementById('home-search-form-area').innerHTML = searchForm;
    });

  }
}

setSearchMethod();

任何要注入到另一个组件中的东西都必须定义为输入组件。这与将组件注入到mat-dialog中一样。

有关更多信息，请参见：https://angular.io/guide/entry-components。

Answer 2

我错过了在小部件模块中导入TripsMenu的情况。

import { TripsMenu } from './menu-widget/trips-menu';

成功了！

角度7：错误错误：未捕获（承诺）：错误：StaticInjectorError（AppModule）[MenuWidgetComponent-> TripsMenu]：

2 个答案: