友情提示：图片看不清请点击鼠标右键 ， 查看图像 一、安装SVN（或者git）
1、下载小乌龟工具（SVN工具） ， 百度搜索SVN即可
2、打开SVN安装包 ， 一路next默认安装即可
二、从公司SVN （或者git）上面拷贝公司目前的前端代码
1、打开文件资源管理器选择开发目录 ， 点击鼠标右键弹出 menu提示框 ， 选择 SVN
2、URL of : 填入公司SVN地址
3、 : 开发目录路径
三、进入开发环境 ， 新建模块
1、打开文件资源管理器 ， 进入开发目录 ， 以脚手架目录为例就是：项目文件夹/src/app
2、执行 ng g c 模块名 新建模块的文件夹,更多ng-cli快捷操作请访问 -cli 地址
3、执行 ng g m 模块名 新建模块的文件（文件作为业务模块的入口 ， 管理和其他组件 ，  ， 指令 ， 服务的关系）
4、选择新模块文件夹 ， 右键点击添加新文件 ， 命名为 模块名..ts ， 并在test..ts元数据的属性里面引入该路由类（即） ， 该文件为新模块的路由配置文件 ， 该文件可以配置子路由 ， 用于路由到该模块的子模块 ， 下面是新建模块文件夹格式

文章插图
5、这里以test模块为例写一个test..ts配置

文章插图
import { NgModule } from '@angular/core';import { Routes, RouterModule } from '@angular/router';import { TestComponent } from './test.component';import { TestChildOneComponent } from './test-child-one/test-child-one.component'import { TestChildTwoComponent } from './test-child-two/test-child-two.component'const routes: Routes = [{path: '',component: TestComponent,data: {title: '测试模块'//这个data数据可以通过路由参数对象获取到,有面包屑导航需求场景时有用},//如果需要路由到子模块 ， 则添加children属性children: [{path: 'test-child-one',component: TestChildOneComponent },{path: 'test-child-two',component: TestChildTwoComponent}]}]@NgModule({imports: [RouterModule.forChild(routes)],exports: [RouterModule]})export class TestRouting { }
四、main路由里面添加链接到新添加模块的路由（main路由用于管理公司业务模块）
打开 main/main..ts 文件 ， 添加链接到新模块的路由 ， 具体见下面代码

文章插图
下面展示main模块的html模板：.html

文章插图
这里顺便展示一下根路由app..ts和对应的html模板.html
.html模板如下：

文章插图
app..ts模板如下：

文章插图
五.引入模块依赖的基类 1、模块.ts里面引入,这里以为例子
import { NgModule } from '@angular/core';import { CommonModule } from '@angular/common';import { WustModule } from '@toplinker/wust';import { TestComponent } from './test.component';@NgModule({imports; [commonModule,WustModule],declarations: [TestComponent],providers: [],exports: [TestComponent]})export class TestModule { }
2、模块.ts里面继承基类
import { Component, OnInit } from '@angular/core';import { IbdCommonService,IbdBaseComponent } from '@topibd/ibd-core';@Component({selector: 'ibd-test',templateUrl: './test.component.html',styleUrls: ['./test.component.css']})export class TestComponent extends IbdBaseComponent implements OnInit {constructor(private commonService: IbdCommonService) {super(commonService)}ngOnInit() {}}

• 上一页
• 1
• 2
• 下一页

• 如何防治菌核病？
• 化学怎么喷火,如何练喷火？
• 化解噩梦夜梦不祥挂在西墙,不好的梦如何化解
• 手把手教你使用Angular之指令
• 登山杖品牌
• 化妆品查真伪扫一扫,如何辨别化妆品真假
• 化妆如何保持妆容持久,怎么化妆才能使妆容更持久？
• 优质母猪,如何选后备母猪
• 包工程怎么包怎么联系,如何包工程
• 包粽子教程,如何包粽子视频