複数の角度コンポーネントで第三者指令を共有する

Question

thisプロジェクトから派生した角度4のプロジェクトでthisライブラリを使用しようとしています。このライブラリのモジュールをコンポーネントモジュールにインポートするとうまく動作します。

import { NgModule, } from '@angular/core'; 
import { LoadingModule } from 'ngx-loading'; 
import { Login } from './login.component'; 


@NgModule({ 
    imports: [ 
    LoadingModule, 
    ], 
    declarations: [ 
    Login 
    ] 
}) 
export class LoginModule { } 

上完全に正常に動作します：たとえば、私はlogin.module.tsを持つログインコンポーネントを持っています。

ただし、重複したコードを作成するため、すべてのコンポーネントでこのモジュールをインポートする必要はありません。したがって、共有モジュールを作成し、その共有モジュールをログインコンポーネントのモジュールとレジスタコンポーネントのモジュールにインポートしました。

このような何か：

import { NgModule } from '@angular/core'; 
import { LoadingModule } from 'ngx-loading'; 

@NgModule({ 
    imports: [ 
     LoadingModule, 
    ], 
}) 

export class SharedModules { 

} 

はlogin.moduleでこれをインポートしようとしました：

import { SharedModules } from '../../sharables/shared.module'; 

@NgModule({ 
    imports: [ 
    SharedModules, 
    ], 
    declarations: [ 
    Login 
    ] 
}) 
export class LoginModule { } 

また、私は私のメインapp.moduleでSharedModulesを輸入しています。

Can't bind to 'show' since it isn't a known property of 'ngx-loading'. 
1. If 'ngx-loading' is an Angular component and it has 'show' input, then verify that it is part of this module. 
2. If 'ngx-loading' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. 
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. 

1. どのように私は角4でこれを達成することができます：上記

   次のエラーがスローされますか？

2. このアプローチが機能しない理由と私はここで何が欠けているのか理解したいと思います。

Answer 1

答えを見つけました。 thisのおかげです。

同じ問題を抱えている他の人に：

これは範囲の問題でした。私はSharedModuleにLoadingModuleをインポートしましたが、LoadingModuleのディレクティブはSharedModulesのスコープにのみ制限されていました。 SharedModulesをインポートしている他のコンポーネント（ログイン/レジスタなど）がSharedModules import（この場合はLoadingModule）にアクセスできるようにするには、それらをにエクスポートする必要があります。

私が一度エクスポートした、私のSharedModulesからのLoadingModule。私のログインコンポーネントは、LoadingModuleのディレクティブにアクセスすることができます

import { NgModule } from '@angular/core'; 
import { LoadingModule } from 'ngx-loading'; 

@NgModule({ 
    imports: [ 
     LoadingModule, 
    ], 
    exports: [ 
     LoadingModule 
    ] 
}) 

export class SharedModules { 

}