From 8647de817742b5c76b4001fac42151ee4f150690 Mon Sep 17 00:00:00 2001 From: Ruin <1830275783@qq.com> Date: Wed, 9 Mar 2022 11:48:11 +0800 Subject: [PATCH] commit --- src/app/app.module.ts | 2 +- src/app/components/list/list.component.ts | 4 +- .../home/components/head/head.component.ts | 15 ++++---- src/app/pages/home/home.component.html | 6 ++- src/app/pages/home/home.component.ts | 34 +++++++++++------ src/app/pages/home/home.module.ts | 2 +- src/app/services/request.service.spec.ts | 16 ++++++++ src/app/services/request.service.ts | 38 +++++++++++++++++++ src/app/services/storage.service.ts | 25 ++---------- 9 files changed, 95 insertions(+), 47 deletions(-) create mode 100644 src/app/services/request.service.spec.ts create mode 100644 src/app/services/request.service.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 41c2d71..b2d2a21 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -4,7 +4,7 @@ * @Author: Ruin 🍭 * @Date: 2022-03-03 16:21:23 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-04 15:49:55 + * @LastEditTime: 2022-03-08 10:53:14 */ // 引入核心模块 import { NgModule } from "@angular/core"; diff --git a/src/app/components/list/list.component.ts b/src/app/components/list/list.component.ts index 1ec7667..f70d4e5 100644 --- a/src/app/components/list/list.component.ts +++ b/src/app/components/list/list.component.ts @@ -4,7 +4,7 @@ * @Author: Ruin 🍭 * @Date: 2022-03-04 10:47:32 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 15:13:23 + * @LastEditTime: 2022-03-07 16:48:12 */ import { Component, OnInit } from "@angular/core"; import { StorageService } from "src/app/services/storage.service"; @@ -20,7 +20,7 @@ export class ListComponent implements OnInit { console.log(this.today); } changeMsg() { - this.storage.msg = "我是改变后的值"; + // this.storage.msg = "我是改变后的值"; } ngOnInit(): void {} diff --git a/src/app/pages/home/components/head/head.component.ts b/src/app/pages/home/components/head/head.component.ts index de9f5ea..d3475d8 100644 --- a/src/app/pages/home/components/head/head.component.ts +++ b/src/app/pages/home/components/head/head.component.ts @@ -4,23 +4,22 @@ * @Author: Ruin 🍭 * @Date: 2022-03-03 17:07:14 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 16:15:13 + * @LastEditTime: 2022-03-07 17:09:00 */ -import { Component, EventEmitter, OnInit, Output } from "@angular/core"; - +import { Component, OnInit } from "@angular/core"; +import { StorageService } from "src/app/services/storage.service"; @Component({ selector: "app-head", templateUrl: "./head.component.html", styleUrls: ["./head.component.scss"], }) export class HeadComponent implements OnInit { - // 实例化事件广播 - @Output() private outerInput = new EventEmitter(); - constructor() {} - ngOnInit(): void {} + constructor(public storage: StorageService) {} getSearchData(e: any) { // 发送事件数据 - this.outerInput.emit("12341234"); + // this.storage.inputData = e.target.value; + localStorage.setItem("input", e.target.value); console.log("方法触发", e.target.value); } + ngOnInit(): void {} } diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html index 7aea474..1e31d0f 100644 --- a/src/app/pages/home/home.component.html +++ b/src/app/pages/home/home.component.html @@ -4,11 +4,13 @@ * @Author: Ruin 🍭 * @Date: 2022-03-03 17:06:15 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 16:15:54 + * @LastEditTime: 2022-03-08 10:34:38 --> - +
+

home work

+

{{ result }}

diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts index 8396334..6c779be 100644 --- a/src/app/pages/home/home.component.ts +++ b/src/app/pages/home/home.component.ts @@ -4,13 +4,12 @@ * @Author: Ruin 🍭 * @Date: 2022-03-03 17:06:15 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 16:15:36 + * @LastEditTime: 2022-03-08 14:38:05 */ import { Component, ElementRef, OnInit, ViewChild } from "@angular/core"; +import { RequestService } from "src/app/services/request.service"; // 引入服务 import { StorageService } from "src/app/services/storage.service"; -// 实例化类 -// let storage = new StorageService(); @Component({ selector: "app-home", templateUrl: "./home.component.html", @@ -18,13 +17,26 @@ import { StorageService } from "src/app/services/storage.service"; }) export class HomeComponent implements OnInit { @ViewChild("homeHead", { static: true }) homeHead: any; - public result: any; - // 依赖注入 语法糖写法 相当于在构造器中 实例化对象 - constructor(public storage: StorageService) {} - ngOnInit(): void {} - ngAfterViewInit(): void {} - receiveSearchInput(e: any) { - this.result = e; - console.log("接收到的", this.result); + public result: any = ""; + constructor(public storage: StorageService, public request: RequestService) {} + // init结尾的函数只会调用一次 checked结尾的函数会多次调用 + // 初始化组件和指令时调用(一般用于请求api) + ngOnInit(): void { + const res = this.request.getData(); + console.log(res); + this.receiveRxjsData(); + } + receiveRxjsData() { + let res = this.request.getRxjsData(); + res.subscribe((data) => { + console.log("通过rxjs获取的数据", data); + }); + // setTimeout(() => { + // // 取消订阅 + // returnRes.unsubscribe(); + // }, 1000); + // setInterval(() => { + // console.log("延迟期触发"); + // }, 1000); } } diff --git a/src/app/pages/home/home.module.ts b/src/app/pages/home/home.module.ts index 81d6f14..d352f18 100644 --- a/src/app/pages/home/home.module.ts +++ b/src/app/pages/home/home.module.ts @@ -4,7 +4,7 @@ * @Author: Ruin 🍭 * @Date: 2022-03-03 17:06:01 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 10:19:20 + * @LastEditTime: 2022-03-07 16:58:46 */ import { NgModule } from "@angular/core"; import { CommonModule } from "@angular/common"; diff --git a/src/app/services/request.service.spec.ts b/src/app/services/request.service.spec.ts new file mode 100644 index 0000000..8297f36 --- /dev/null +++ b/src/app/services/request.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { RequestService } from './request.service'; + +describe('RequestService', () => { + let service: RequestService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(RequestService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/services/request.service.ts b/src/app/services/request.service.ts new file mode 100644 index 0000000..c11eb28 --- /dev/null +++ b/src/app/services/request.service.ts @@ -0,0 +1,38 @@ +/* + * @Description: {{ByRuin}} + * @Version: 2.0 + * @Author: Ruin 🍭 + * @Date: 2022-03-08 10:51:22 + * @LastEditors: 刘引 + * @LastEditTime: 2022-03-08 14:52:32 + */ +import { Injectable } from "@angular/core"; +// 引入rxjs +import { Observable } from "rxjs"; +@Injectable({ + providedIn: "root", +}) +export class RequestService { + constructor() {} + // 同步方法 + getData() { + console.log("%c获取需要的数据", "color:pink"); + return "1234"; + } + // 使用rxjs + getRxjsData() { + let count = 0; + return new Observable((observer) => { + setTimeout(() => { + // setInterval(() => { + // count++; + // }, 1000); + observer.next(count); + // let username = "张三"; + + // observer.error("错误"); + }, 3000); + }); + } + // 过一秒以后撤回刚才的操作 +} diff --git a/src/app/services/storage.service.ts b/src/app/services/storage.service.ts index d79aff2..207b16a 100644 --- a/src/app/services/storage.service.ts +++ b/src/app/services/storage.service.ts @@ -4,7 +4,7 @@ * @Author: Ruin 🍭 * @Date: 2022-03-07 09:39:15 * @LastEditors: 刘引 - * @LastEditTime: 2022-03-07 15:08:49 + * @LastEditTime: 2022-03-07 16:51:22 */ import { Injectable } from "@angular/core"; @@ -13,25 +13,6 @@ import { Injectable } from "@angular/core"; }) export class StorageService { constructor() {} - public msg: string = "我是信息"; - getTest() { - return "this is service"; - } - - // 添加缓存 - setStorage(key: any, value: any) { - localStorage.setItem(key, JSON.stringify(value)); - } - // 读取缓存 - getStorage(key: any): any { - return localStorage.getItem(key); - } - // 删除指定缓存 - removeStorage(key: any): any { - localStorage.removeItem(key); - } - // 删除所有缓存 - clearStorage() { - localStorage.clear(); - } + // 定义公共数据 + public inputData: string = ""; }