如何在 Angular 4 中导入自定义模块?

知乎

我正在尝试使用我构建的自定义模块之一并将其放入另一个模块中

自定义模块:

我的-test.module.ts

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

import { MyTestComponent } from './my-test.component';

@NgModule({
  declarations: [
    MyTestComponent    
  ],
  imports: [
    CommonModule,    
  ],  
  exports: [ MyTestComponent]
})
export class MyTestModule { }

我需要引入的另一个模块

my-parent.module.ts

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

import { MyParentComponent } from './my-parent.component';
import { MyTestModule } from '../my-test/my-test.module';

@NgModule({
    'imports': [
        CommonModule,
        MyTestModule        
    ],
    'declarations': [
        MyParentComponent
    ],    
    'exports': [
        MyParentComponent
    ]   
})

export class MyParentModule {}

my-parent.component.ts

import { Component, Inject, Injectable, OnInit  } from '@angular/core';
import { MyTestComponent } from '../my-test/my-test.component'

@Component({
    'selector': 'my-parent',
    'template': `
       test
    `
})

@Injectable()

export class MyParentComponent implements OnInit {    
    public myTestComponent: MyTestComponent;
    constructor() {}

    ngOnInit() {
       console.log(this.myTestComponent)  <----show undefined here.
    }    
}

我不确定如何将 my-test 组件导入到 my-parent 组件中。我究竟做错了什么?非常感谢!

更新

稍微更改我上面的代码以适合我的情况。它以 aMytestComponent开头并this.myTestComponent显示未定义。

穆罕默德

1- 在 my-parent.component.html 添加 <test component selector> </ test component selector #test>

2- 在父 ts 文件中添加:

@ViewChild('test') test: MyTestComponent;

那么您将能够访问 MyTestComponent 中的所有方法和参数

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在Google Colab中导入自定义模块?

如何在IntelliJ IDEA(Java)中导入自定义程序包?

在angular中导入自定义javascript

如何在Julia中导入自定义模块

如何在Angular2 / 4/5中实现自定义异步验证器

如何在XCode 6中导出/导入自定义代码段

如何在控制器Laravel中导入自定义类?

如何使用angular-cli自定义bootstrap 4

如何在HTML邮件程序(HTML电子邮件)中导入自定义字体

如何在Angular / Angular2 / Angular4应用程序中导入和使用particles.js

在Angular 4中的多个模块中导入组件

在Angular4中导入自定义字体

如何在Angular 5自定义验证中使用Bootstrap 4验证伪类(:valid,:invalid)?

如何在Angular 4项目中导入waveurfer.js?

如何在Angular 4.x(Angular Cli)App中导入RequireJS(AMD)模块?

如何在Angular(2/4)中导入'url-regex'npm包?

如何在angular 4中使用自定义jquery插件

从Angular 4中的其他包中导入模块

如何在自定义组件angular 4中访问表单验证

如何在Cakephp MiddleWare类中导入自定义组件?

如何在Angular应用程序中导入PDFMake的自定义字体?

如何在Angular 9中导入所有Angular Material模块

Angular 2/4:如何使我的自定义组件只读

如何在 node-red 中导入自定义 jar

如何在 Ionic 4 中导入自定义 css 和 js

如何在 angular 8 中导入表单模块

如何在 NuxtJS 中的 nuxt.config.js 中导入自定义 css 文件?

如何在 Next JS 中导入自定义字体?

无法在 Angular 中导入我的自定义组件