加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Angular 2中的Import语句顺序

发布时间:2020-12-17 17:03:02 所属栏目:安全 来源:网络整理
导读:角度样式指南说明了导入行间距: 考虑在第三方导入和第三方导入之间留下一个空行 申请进口. 考虑列出按字母顺序排列的导入行 模块. 考虑列出破坏的导入符号 按字母顺序排列. 为什么?空行将你的东西与他们的东西分开 东西. 为什么?字母顺序使读取和定位符号
角度样式指南说明了导入行间距:

>考虑在第三方导入和第三方导入之间留下一个空行
申请进口.
>考虑列出按字母顺序排列的导入行
模块.
>考虑列出破坏的导入符号
按字母顺序排列.
>为什么?空行将你的东西与他们的东西分开
东西.
>为什么?字母顺序使读取和定位符号更容易.

观察包括Angular本身在内的许多Angular项目,惯例是首先导入Angular(@angular)模块,然后导入第三方模块(例如AngularFire2),然后导入我们自己的模块(服务,组件等),例如: ./some-service.ts.

再次看起来导入服务,然后是模型然后导入组件是惯例.

但接口和管道等呢?导入“无名”或通配符模块的惯例是什么,例如Firebase SDK或RxJs操作符?

例如:

导入RxJs运算符的示例服务

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

import { AngularFireAuth } from 'angularfire2/auth';
import {
  AngularFireDatabase,FirebaseListObservable
} from 'angularfire2/database';
import * as firebase from 'firebase/app';
import 'rxjs/add/operator/take';
...

要么

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

import {
  AngularFireDatabase,FirebaseListObservable
} from 'angularfire2/database';
import * as firebase from 'firebase/app';
import { Observable } from 'rxjs/Observable';

import { AuthService } from './auth.service';
// `GridMetadata` is an Interface
import { GridMetadata } from './grid-metadata';
...

解决方法

实际上,查看Angular代码库并更好地理解指南,有一个答案.

“考虑在第三方导入和应用程序导入之间留下一条空行.”

这只是一个例子来解释它:

// Core imports
import { TestBed,async,inject } from '@angular/core/testing';

// Third party imports
import { AngularFireAuth } from 'angularfire2/auth';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/of';

// Application imports
import { AuthService } from './auth.service';
import { environment } from '../environments/environment';

“考虑列出由模块按字母顺序排列的导入行.”

将“模块”视为“来自”之后的位.模块包含要导入的符号.

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

import { AngularFireAuth } from 'angularfire2/auth';
import * as firebase from 'firebase/app';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/catch';

符号是什么并不重要;重要的是导入行由模块按字母顺序排列.例如

> angularfire2 / auth
> firebase / app
> rxjs / Rx
> rxjs / add / observable /
> rxjs / add / operator / catch

在Angular代码库中,很明显小写字符列在大写或大写字符之后,因此:’rxjs / Rx’列在’rxjs / add / observable / of’和’rxjs / add / operator / catch’之前

“考虑按字母顺序列出破坏的导入符号.”

import { TestBed,inject } from '@angular/core/testing';

import { AngularFireAuth } from 'angularfire2/auth';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/of';

将“结构化导入符号”视为已从其父模块中提取的导出符号.在这个例子中,AngularFireAuth,Observable,TestBed,async和inject都是解构的导入符号.

同样,订单按字母顺序排列;首先是大写,然后是大写,然后是小写.以下是Angular代码库的一个很好的例子:

import {CUSTOM_ELEMENTS_SCHEMA,Compiler,Component,Directive,Inject,Injectable,Injector,Input,NgModule,Optional,Pipe,SkipSelf,?stringify as stringify} from '@angular/core';

在Angular代码库中导入服务,管道,模型,指令或组件等似乎没有任何特定顺序

注意,父目录中的模块是在更靠近它们被导入模块的模块之后导入的.

import { AuthService } from './auth.service';
import { environment } from '../environments/environment';
import { abc } from '.../abc';

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读