Question

我已经习惯了Angular 2，但我有一些关于 app.module.ts 文件的问题。

为什么我必须在此文件中执行导入，因为我将会这样做 app.components.ts 文件中的输入。

例如：我导入我的自定义管道，然后我必须在我的导入它 app.components.ts 文件

import { FirstPipePipe } from './first-pipe.pipe';

@NgModule({
     declarations: [
       AppComponent,
       SecondComponent,
       ThirdComponent,
       FirstComponent,
       FirstPipePipe
     ],
     imports: [
       BrowserModule, RouterModule.forRoot(appRoutes), HttpModule
     ],
     providers: [FetchDataService],
     bootstrap: [AppComponent]    })

然后我有了

imports: [
           BrowserModule, RouterModule.forRoot(appRoutes), HttpModule
         ],

为什么我要导入一些类而不导入其他类？

为什么这里的提供商再次出现在 app.component.ts

中

providers: [FetchDataService]

基本上，我必须重写 app.component.ts 文件中的所有内容。

app.module.ts的目的是什么？

Answer 1

模块是一种组织和分离代码的方法。您可以拥有多个模块并延迟加载某些模块。

您可以将任何其他模块导入import pandas as pd import numpy as np import datetime as dt def fmtfn(arg_dttm, arg_int): retstr = arg_dttm.strftime(':%Y-%m-%d') + '{:0>3}'.format(arg_int) # bombs with: 'numpy.datetime64' object has no attribute 'strftime' # retstr = '{:%Y-%m-%d}~{:0>3}'.format(arg_dttm, arg_int) # bombs with: invalid format specifier return retstr def fmtfn2(arg_dtstr, arg_int): retstr = '{}~{:0>3}'.format(arg_dtstr, arg_int) return retstr # The source data. # I want to add a 3rd column newhg that carries e.g. 2017-06-25~066 # i.e. a concatenation of the other two columns. df1 = pd.DataFrame({'mydt': ['2017-05-07', '2017-06-25', '2015-08-25'], 'myint': [66, 201, 100]}) df1['mydt'] = pd.to_datetime(df1['mydt'], errors='raise') # THIS WORKS (without calling a function) print('\nInline solution') df1['newhg'] = df1[['mydt', 'myint']].apply(lambda x: '{:%Y-%m-%d}~{:0>3}'.format(x[0], x[1]), axis=1) print(df1) # THIS WORKS print('\nConvert to string first') df1['mydt2'] = df1['mydt'].apply(lambda x: x.strftime('%Y-%m-%d')) df1['newhg'] = np.vectorize(fmtfn2)(df1['mydt2'], df1['myint']) print(df1) # Bombs in the function - see above print('\nPass a datetime') df1['newhg'] = np.vectorize(fmtfn)(df1['mydt'], df1['myint']) print(df1)部分。

您在imports中声明了任何组件。必须在该模块中声明该模块路由中使用的任何组件。如果组件在另一个模块中使用，那么您只在其他模块中列出它们。

您可以在declarations部分提供服务。

模块还有助于控制依赖注入...您可以在组件级别或模块级别providers服务。在模块级别提供服务，创建要在整个模块中共享的服务实例。如果在组件级别提供服务，则它是该组件的唯一实例。最好只在一个级别提供服务以避免混淆 - 无论是在模块级别还是在组件级别（在您需要的每个组件中）。我发现在大多数情况下，对于我自己来说，仅在模块级别提供服务是最好和最简单的。与provide相同，但您所做的任何组件/管道仍必须在pipes中声明。

Answer 2

app.module.ts的目的是什么？

启动您的应用程序，并设置指向其他模块的链接。

1 - 模块是应用程序的逻辑层。每个模块都用于逻辑打包，因此人们更容易理解和维护由多个模块组成的应用程序。例如，如果您正在使用丰富的应用程序，则应该有 LoginModule ， AuthenticationModule 等...

2 - 您需要导入模块中的内容，以便Angular知道它将使用什么。基本上， LoginModule 需要Angular FormModule ， AuthenticationModule

可能不需要

3 - 这引导我们： AppModule 因此只应导入与其链接的其他模块，并提供全局所需的服务即可。您的未来 LoginModule 不需要提供服务，但 AuthenticationModule ，其中很可能会有 AuthenticationService 。

这些是基本概念，请阅读官方文档，该文档提供了有关此主题的大量知识：https://angular.io/guide/ngmodule

Answer 3

什么是AppModule AppModule是引导并启动角度应用程序的根模块。您可以随意命名，但按照惯例，它的名称为AppModule。

它导入2个系统模块-BrowserModule和NgModule

BrowserModule-在浏览器中运行的每个应用程序都需要此模块。此模块还提供了NgIf和NgFor指令。

NgModule-@component装饰器将元数据添加到角度组件类，@NgModule装饰器将元数据添加到角度模块类。

app.module.ts文件用于什么，我应该在其中做什么？

3 个答案: