diff --git a/src/app/demo/demo.module.ts b/src/app/demo/demo.module.ts
index fea9846..d6e9032 100644
--- a/src/app/demo/demo.module.ts
+++ b/src/app/demo/demo.module.ts
@@ -7,6 +7,7 @@ import {demoRoutes} from './demo.route';
import {VideoComponent} from './video/video.component';
import {HttpDemoComponent} from './http-demo/http-demo.component';
import {JquaryComponent} from './jquary/jquary.component';
+import { NgZorroComponent } from './ng-zorro/ng-zorro.component';
@NgModule({
@@ -20,6 +21,7 @@ import {JquaryComponent} from './jquary/jquary.component';
JquaryComponent,
HttpDemoComponent,
VideoComponent,
+ NgZorroComponent,
]
})
export class DemoModule { }
diff --git a/src/app/demo/demo.route.ts b/src/app/demo/demo.route.ts
index 302a34d..c198957 100644
--- a/src/app/demo/demo.route.ts
+++ b/src/app/demo/demo.route.ts
@@ -2,6 +2,7 @@ import {IndexComponent} from './index/index.component';
import {HttpDemoComponent} from './http-demo/http-demo.component';
import {VideoComponent} from './video/video.component';
import {JquaryComponent} from './jquary/jquary.component';
+import {NgZorroComponent} from './ng-zorro/ng-zorro.component';
export const demoRoutes = [
{
@@ -20,6 +21,10 @@ export const demoRoutes = [
path: 'httpDemo',
component: HttpDemoComponent
},
+ {
+ path: 'nz',
+ component: NgZorroComponent
+ },
{
path: '',
redirectTo: 'index',
diff --git a/src/app/demo/ng-zorro/ng-zorro.component.html b/src/app/demo/ng-zorro/ng-zorro.component.html
new file mode 100644
index 0000000..81c8bbd
--- /dev/null
+++ b/src/app/demo/ng-zorro/ng-zorro.component.html
@@ -0,0 +1,4 @@
+
+
diff --git a/src/app/demo/ng-zorro/ng-zorro.component.scss b/src/app/demo/ng-zorro/ng-zorro.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/demo/ng-zorro/ng-zorro.component.spec.ts b/src/app/demo/ng-zorro/ng-zorro.component.spec.ts
new file mode 100644
index 0000000..0a7f97b
--- /dev/null
+++ b/src/app/demo/ng-zorro/ng-zorro.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NgZorroComponent } from './ng-zorro.component';
+
+describe('NgZorroComponent', () => {
+ let component: NgZorroComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ NgZorroComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(NgZorroComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should be created', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/demo/ng-zorro/ng-zorro.component.ts b/src/app/demo/ng-zorro/ng-zorro.component.ts
new file mode 100644
index 0000000..bce5d4b
--- /dev/null
+++ b/src/app/demo/ng-zorro/ng-zorro.component.ts
@@ -0,0 +1,19 @@
+import {AfterViewInit, Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-ng-zorro',
+ templateUrl: './ng-zorro.component.html',
+ styleUrls: ['./ng-zorro.component.scss']
+})
+export class NgZorroComponent implements OnInit, AfterViewInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+ ngAfterViewInit(): void {
+ $('page-wrapper').css('background-color', '#FCF8E3'); // 设置iframe 集成页面的背景色
+ }
+}
diff --git a/src/app/nav/app-nav.component.html b/src/app/nav/app-nav.component.html
index 79f12c1..ba5139c 100644
--- a/src/app/nav/app-nav.component.html
+++ b/src/app/nav/app-nav.component.html
@@ -2,6 +2,7 @@
- 首页
- 示例Demo
+ - 阿里nz-zorro手册
-
开源地址
diff --git a/src/assets/doc/component.md b/src/assets/doc/component.md
index d1db923..de8f2ba 100644
--- a/src/assets/doc/component.md
+++ b/src/assets/doc/component.md
@@ -2,12 +2,12 @@
市面上可用的 Angular开源免费好用的组件库：
-[PrimeNG](https://www.primefaces.org/primeng/) ：这款组件库做得比较早，代码质量比较高。
-[NG-Zorro](https://github.com/NG-ZORRO/ng-zorro-antd)：来自阿里云团队，外观是 AntDesign 风格。
-[Element-Angular](https://element-angular.faas.ele.me/?pathname=/guide/install)：作者来自饿了么团队。
-[Clarity](https://vmware.github.io/clarity/)：来自Vmware团队。
-[Angular-Material](https://github.com/angular/material2)：Angular 官方提供的组件库。目前（2017-10）一共规划了38个组件，Material Design 风格，代码质量比较高。
-[Ionic](http://ionicframework.com/)：专门为移动端打造的组件库，自带周边工具，生态很完善
+- [PrimeNG](https://www.primefaces.org/primeng/) ：这款组件库做得比较早，代码质量比较高。
+- [NG-Zorro](https://github.com/NG-ZORRO/ng-zorro-antd)：来自阿里云团队，外观是 AntDesign 风格。
+- [Element-Angular](https://element-angular.faas.ele.me/?pathname=/guide/install)：作者来自饿了么团队。
+- [Clarity](https://vmware.github.io/clarity/)：来自Vmware团队。
+- [Angular-Material](https://github.com/angular/material2)：Angular 官方提供的组件库。目前（2017-10）一共规划了38个组件，Material Design 风格，代码质量比较高。
+- [Ionic](http://ionicframework.com/)：专门为移动端打造的组件库，自带周边工具，生态很完善
增加方法看每个网站的快速启动就可以了。
diff --git a/src/assets/doc/js-plug.md b/src/assets/doc/js-plug.md
index 6cd843e..1acc9d4 100644
--- a/src/assets/doc/js-plug.md
+++ b/src/assets/doc/js-plug.md
@@ -1,6 +1,18 @@
# 集成第三方js库方法
-集成Bootstrap、Jquery 方式，其他类比。
+### 把你的js库引入项目，比如放在文件夹assets中，然后修改.angular-cli.json文件
+```
+"styles": [
+ "styles.css",
+ "../node_modules/bootstrap/dist/css/bootstrap.min.css"
+ ],
+ "scripts": [
+ "../node_modules/jquery/dist/jquery.js",
+ "../node_modules/bootstrap/dist/js/bootstrap.js"
+ ],
+```
+### 即可。
+### 例如：集成Bootstrap、Jquery 方式，其他类比。
1、 在工程目录下面安装以下两个包
diff --git a/src/assets/img/show-index.png b/src/assets/img/show-index.png
new file mode 100644
index 0000000..61579bc
Binary files /dev/null and b/src/assets/img/show-index.png differ