另一个模块使用的组件,无需导出

时间:2018-08-03 14:27:13

标签: angular

根据定义,我发现Angular模块可以导入另一个模块,然后可以使用在该模块中导出的那些组件。例如,我有一个app模块和一个shared模块。我已经在shared模块中导入了app模块。 shared模块具有一个名为log的组件。我可以在app模块中使用该组件。但是shared模块没有导出log组件。

project structure

应用模块

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

import { AppComponent } from './app.component';
import { SharedModule } from './shared/shared.module';
import { LogComponent } from './shared/log.component';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        SharedModule
    ],
    bootstrap: [LogComponent]
})
export class AppModule { }

共享模块

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

import { LogComponent } from './log.component';

@NgModule({
    imports: [
        CommonModule
    ],
        declarations: [
        LogComponent
    ]/*,
    exports: [
        LogComponent
    ]*/
})
export class SharedModule { }

日志组件

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

@Component({
    selector: 'app-log',
    templateUrl: './log.component.html'
})
export class LogComponent {
    title: string = "this is log component";
}

记录html

<p>
    {{title}}
</p>

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>ModuleDemo</title>
    <base href="/">

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
    <app-log></app-log>
</body>
</html>

output

任何人都可以清除它吗,为什么不导入log组件app模块也可以使用它。

0 个答案:

没有答案