-
home work
-
-
{{ result }}
+
-
-
-
-
diff --git a/src/app/pages/home/home.component.scss b/src/app/pages/home/home.component.scss
index e69de29..736047b 100644
--- a/src/app/pages/home/home.component.scss
+++ b/src/app/pages/home/home.component.scss
@@ -0,0 +1,33 @@
+.home-root {
+ // height: calc(100vh - 110px);
+ // overflow-y: scroll;
+ .w {
+ display: flex;
+ aside {
+ flex: 3;
+ border-right: 1px solid pink;
+ ul {
+ li {
+ font-size: 16px;
+ // background-color: red;
+
+ border-bottom: 1px solid black;
+ a {
+ display: block;
+ height: 40px;
+ padding: 5px;
+ line-height: 30px;
+ // background-color: red;
+
+ border-bottom: green;
+ }
+ }
+ }
+ }
+
+ section {
+ flex: 7;
+ background-color: yellow;
+ }
+ }
+}
diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts
index 7c88865..ca8db04 100644
--- a/src/app/pages/home/home.component.ts
+++ b/src/app/pages/home/home.component.ts
@@ -4,13 +4,13 @@
* @Author: Ruin 🍭
* @Date: 2022-03-03 17:06:15
* @LastEditors: 刘引
- * @LastEditTime: 2022-03-09 13:47:01
+ * @LastEditTime: 2022-03-09 16:52:44
*/
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { RequestService } from "src/app/services/request.service";
// 引入服务
import { StorageService } from "src/app/services/storage.service";
-import { ActivatedRoute } from "@angular/router";
+import { ActivatedRoute, Router, NavigationExtras } from "@angular/router";
@Component({
selector: "app-home",
templateUrl: "./home.component.html",
@@ -23,7 +23,8 @@ export class HomeComponent implements OnInit {
constructor(
public storage: StorageService,
public request: RequestService,
- public route: ActivatedRoute
+ public route: ActivatedRoute,
+ public routeFn: Router
) {}
// init结尾的函数只会调用一次 checked结尾的函数会多次调用
// 初始化组件和指令时调用(一般用于请求api)
@@ -45,4 +46,10 @@ export class HomeComponent implements OnInit {
// console.log("延迟期触发");
// }, 1000);
}
+ navigateToUser() {
+ let queryParams: NavigationExtras = {
+ queryParams: { ad: 1234 },
+ };
+ this.routeFn.navigate(["/user"], queryParams);
+ }
}
diff --git a/src/app/components/list/list.component.html b/src/app/pages/not-found/not-found.component.html
similarity index 53%
rename from src/app/components/list/list.component.html
rename to src/app/pages/not-found/not-found.component.html
index 839ad4a..49d33e1 100644
--- a/src/app/components/list/list.component.html
+++ b/src/app/pages/not-found/not-found.component.html
@@ -2,8 +2,8 @@
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
- * @Date: 2022-03-04 10:47:32
+ * @Date: 2022-03-09 17:09:54
* @LastEditors: 刘引
- * @LastEditTime: 2022-03-07 16:00:33
+ * @LastEditTime: 2022-03-09 17:10:07
-->
-
list works
+
404
diff --git a/src/app/components/list/list.component.scss b/src/app/pages/not-found/not-found.component.scss
similarity index 100%
rename from src/app/components/list/list.component.scss
rename to src/app/pages/not-found/not-found.component.scss
diff --git a/src/app/pages/not-found/not-found.component.ts b/src/app/pages/not-found/not-found.component.ts
new file mode 100644
index 0000000..7cb4124
--- /dev/null
+++ b/src/app/pages/not-found/not-found.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-not-found',
+ templateUrl: './not-found.component.html',
+ styleUrls: ['./not-found.component.scss']
+})
+export class NotFoundComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(): void {
+ }
+
+}
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index f088551..a83bad1 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -4,15 +4,16 @@
* @Author: Ruin 🍭
* @Date: 2022-03-03 17:03:51
* @LastEditors: 刘引
- * @LastEditTime: 2022-03-09 11:30:57
+ * @LastEditTime: 2022-03-09 17:20:50
*/
import { NgModule } from "@angular/core";
import { HomeModule } from "./home/home.module";
import { UserModule } from "./user/user.module";
+import { NotFoundComponent } from "./not-found/not-found.component";
// 引入并且配置服务
@NgModule({
- declarations: [],
+ declarations: [NotFoundComponent],
imports: [HomeModule, UserModule],
providers: [],
exports: [HomeModule, UserModule],
diff --git a/src/app/pages/user/user.component.html b/src/app/pages/user/user.component.html
index 32af0b2..9a93d53 100644
--- a/src/app/pages/user/user.component.html
+++ b/src/app/pages/user/user.component.html
@@ -4,18 +4,6 @@
* @Author: Ruin 🍭
* @Date: 2022-03-04 10:45:56
* @LastEditors: 刘引
- * @LastEditTime: 2022-03-09 13:23:58
+ * @LastEditTime: 2022-03-09 15:41:40
-->
-
user works!
-
-
-
-
跳转回主页
-
-
跳转
-
-
-
- - {{ item.description }}
-
-
+
我是用户页
diff --git a/src/app/pages/user/user.component.ts b/src/app/pages/user/user.component.ts
index 201eefd..ff6dcc7 100644
--- a/src/app/pages/user/user.component.ts
+++ b/src/app/pages/user/user.component.ts
@@ -4,7 +4,7 @@
* @Author: Ruin 🍭
* @Date: 2022-03-04 10:45:56
* @LastEditors: 刘引
- * @LastEditTime: 2022-03-09 13:59:01
+ * @LastEditTime: 2022-03-09 14:50:10
*/
import { Component, OnInit } from "@angular/core";
import { ActivatedRoute } from "@angular/router";
@@ -25,7 +25,7 @@ export class UserComponent implements OnInit {
public list: any;
ngOnInit(): void {
this.route.queryParams.subscribe((params) => {
- console.log("路由传过来的参数", params);
+ console.log("get接收到的参数", params);
});
// this.route.params.subscribe((params) => {
// console.log("动态路由路径", params);
diff --git a/src/styles.scss b/src/styles.scss
index 8c613aa..84c3d8f 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,9 +1,27 @@
/* You can add global styles to this file, and also import other style files */
@import "../node_modules/normalize-scss/sass/normalize";
+@import "~ng-zorro-antd/ng-zorro-antd.min.css";
+
* {
margin: 0;
padding: 0;
+ box-sizing: border-box !important;
+ a {
+ text-decoration: none;
+ color: black;
+ }
}
.active {
color: red;
}
+.w {
+ width: 1400px;
+ margin: 0 auto;
+}
+ul {
+ padding: 0;
+ margin: 0;
+ li {
+ list-style: none;
+ }
+}
diff --git a/src/theme.less b/src/theme.less
new file mode 100644
index 0000000..ecf2541
--- /dev/null
+++ b/src/theme.less
@@ -0,0 +1,9 @@
+
+// Custom Theming for NG-ZORRO
+// For more information: https://ng.ant.design/docs/customize-theme/en
+@import "../node_modules/ng-zorro-antd/ng-zorro-antd.less";
+
+// Override less variables to here
+// View all variables: https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/style/themes/default.less
+
+// @primary-color: #1890ff;