Question

在discussion之后，我遇到了同样的问题：我无法在多个模块中导入angular2-materialize的指令，而没有错误消息＆＃34; Type X是其中的一部分2个模块的声明＆＃34;

我决定按照给出的解决方案：将angular2-materialize放在自己的模块中，然后在我的AppModule和我的ChildrenModule中导入模块。

所以我的 MaterialiseModule ：

import { NgModule } from '@angular/core';

// Import Materialize CSS + Directives, like indicated in the readme 
// https://github.com/InfomediaLtd/angular2-materialize
import 'materialize-css';
import 'angular2-materialize';

import { MaterializeDirective } from 'angular2-materialize';

@NgModule({
    declarations: [ MaterializeDirective ]
})
export class MaterializeModule {
}

我的 AppModule ：

import { MaterializeModule } from './shared/materialize.module';

@NgModule({
  bootstrap: [ AppComponent ],
  declarations: [
    AppComponent,
    HeaderComponent,
    FooterComponent,
    NoContentComponent
  ],
  imports: [ // import Angular's modules
    BrowserModule,
    FormsModule,
    HttpModule,
    MaterializeModule,
    RouterModule.forRoot(ROUTES, { useHash: false })
  ],
  providers: [ // expose our Services and Providers into Angular's dependency injection
    ENV_PROVIDERS,
    APP_PROVIDERS
  ]
})
export class AppModule {}

我的 ChildrenModule ：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

// Import shared modules
import { MaterializeModule } from '../shared/materialize.module';

// Import child routes
import { detailsRouting } from './details.routing';

// Import app modules
import { DetailsComponent} from './details.component';

@NgModule({
    imports: [
        BrowserModule,
        MaterializeModule,
        detailsRouting
    ],
    declarations: [
        DetailsComponent
    ]
})
export class ChildrenModule { } //

要完成，在两个模块中，我只需要一个带有MD模式的模板：

<a materialize="leanModal" [materializeParams]="[{dismissible: false}]" class="waves-effect waves-light btn modal-trigger blue" href="#missionAccept">
                <i class="material-icons left">check</i>Accepter
            </a>

我认为这肯定会解决我的问题，但不会。

我有：

can't bind to 'materializeParams' since it isn't a known property of 'a'

喜欢从未导入MaterialiseDirective。

关于这个问题我现在几个小时，它可能来自哪里？

修改

这解决了我的问题：

在我的MaterialiseModule中，永远不要忘记导出指令：

@NgModule({
    ...
    exports: [ MaterializeDirective ]
})

Answer 1

这里的关键是根据angular.io上的说明使用共享模块。您可以创建模块并导入要与其他模块共享的任何内容。要使用它们，可以将sharedmodule导入到需要指令或管道的模块中。

这是我的共享模块：

import { NgModule, ModuleWithProviders } from '@angular/core';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule } from '@angular/forms';
import { AuthorizationService } from '../services/authorization.service';
import { LoginService } from '../services/login.service';
import { RegisterService } from '../services/register.service';
import { ValidationService } from '../services/validation.service';
import { AppMenuService } from '../services/appMenu.service';
import { AuthGuardService } from '../services/authGuard.service';
import {InputTextModule, GalleriaModule, MenubarModule } from 'primeng/primeng'

@NgModule({
   imports: [ CommonModule, RouterModule, HttpModule, MenubarModule, 
              GalleriaModule, InputTextModule ],
   declarations: [ ], 
   exports:  [ CommonModule, ReactiveFormsModule, HttpModule, RouterModule, 
               MenubarModule, GalleriaModule, InputTextModule ] 
})

export class SharedModule {
  static forRoot(): ModuleWithProviders {
  return {
     ngModule: SharedModule,
     providers: [ AppMenuService, AuthorizationService, LoginService, 
                  RegisterService, ValidationService, AuthGuardService ]
      };
   }
}

由于它的可分享性，我在我的应用程序中使用它。

无法在其他NgModule中加载NgModule的共享指令

1 个答案: