From 861c679ce122d92b36112969108815ba408bd94b Mon Sep 17 00:00:00 2001 From: HarveyMac Date: Sun, 6 Nov 2022 14:35:52 +0800 Subject: [PATCH] =?UTF-8?q?Service=20Interaction=20=EF=BC=8CService=20?= =?UTF-8?q?=E6=B0=B4=E5=B9=B3=E4=BA=92=E5=8B=95=20APP.component=E5=88=9D?= =?UTF-8?q?=E5=A7=8B=E5=8C=96Service=20Value=20font-size=20=E4=BD=BF?= =?UTF-8?q?=E7=94=A8=E7=95=AB=E9=9D=A2=E6=94=B9=E8=AE=8AValue=20other?= =?UTF-8?q?=E5=89=87=E9=A1=AF=E7=A4=BA=E5=87=BA=E5=89=87=E9=A1=AF=E7=A4=BA?= =?UTF-8?q?=E5=87=BAValue=E5=80=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/app.component.html | 3 ++- src/app/app.component.ts | 9 +++------ src/app/app.module.ts | 4 +++- src/app/font-size.service.ts | 8 ++++++++ src/app/font-size/font-size.component.css | 0 src/app/font-size/font-size.component.html | 6 ++++++ src/app/font-size/font-size.component.ts | 17 +++++++++++++++++ src/app/other/other.component.css | 0 src/app/other/other.component.html | 1 + src/app/other/other.component.ts | 16 ++++++++++++++++ src/app/task.service.ts | 19 ------------------- src/app/task.ts | 9 --------- 12 files changed, 56 insertions(+), 36 deletions(-) create mode 100644 src/app/font-size.service.ts create mode 100644 src/app/font-size/font-size.component.css create mode 100644 src/app/font-size/font-size.component.html create mode 100644 src/app/font-size/font-size.component.ts create mode 100644 src/app/other/other.component.css create mode 100644 src/app/other/other.component.html create mode 100644 src/app/other/other.component.ts delete mode 100644 src/app/task.service.ts delete mode 100644 src/app/task.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index ec4a8ff..546b963 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1 +1,2 @@ -
{{ tasks | json }}
+ + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 350eb5d..a807179 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,7 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import { FontSizeService } from './font-size.service'; -import { Task } from './task'; -import { TaskService } from './task.service'; @Component({ selector: 'my-app', @@ -9,11 +8,9 @@ import { TaskService } from './task.service'; styleUrls: ['./app.component.css'], }) export class AppComponent implements OnInit { - tasks!: Task[]; - - constructor(private taskService: TaskService) {} + constructor(public fontSizeService: FontSizeService) {} ngOnInit(): void { - this.tasks = this.taskService.getTasks(); + this.fontSizeService.size = 10; } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 93c6719..45c9d60 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -3,10 +3,12 @@ import { BrowserModule } from '@angular/platform-browser'; import { FormsModule } from '@angular/forms'; import { AppComponent } from './app.component'; +import { OtherComponent } from './other/other.component'; +import { FontSizeComponent } from './font-size/font-size.component'; @NgModule({ imports: [ BrowserModule, FormsModule ], - declarations: [ AppComponent ], + declarations: [ AppComponent, OtherComponent, FontSizeComponent ], bootstrap: [ AppComponent ] }) export class AppModule { } diff --git a/src/app/font-size.service.ts b/src/app/font-size.service.ts new file mode 100644 index 0000000..c4db624 --- /dev/null +++ b/src/app/font-size.service.ts @@ -0,0 +1,8 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root' +}) +export class FontSizeService { +size!:number +} diff --git a/src/app/font-size/font-size.component.css b/src/app/font-size/font-size.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/font-size/font-size.component.html b/src/app/font-size/font-size.component.html new file mode 100644 index 0000000..f8711f5 --- /dev/null +++ b/src/app/font-size/font-size.component.html @@ -0,0 +1,6 @@ + + diff --git a/src/app/font-size/font-size.component.ts b/src/app/font-size/font-size.component.ts new file mode 100644 index 0000000..69144df --- /dev/null +++ b/src/app/font-size/font-size.component.ts @@ -0,0 +1,17 @@ +import { FontSizeService } from './../font-size.service'; +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-font-size', + templateUrl: './font-size.component.html', + styleUrls: ['./font-size.component.css'] +}) +export class FontSizeComponent { + + constructor(public fontSizeService:FontSizeService) { } + + onSetFontSize(value: number): void { + this.fontSizeService.size += value; + } + +} diff --git a/src/app/other/other.component.css b/src/app/other/other.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/other/other.component.html b/src/app/other/other.component.html new file mode 100644 index 0000000..44df1e1 --- /dev/null +++ b/src/app/other/other.component.html @@ -0,0 +1 @@ +

目前文字尺寸：{{ fontSizeService.size }} pt

diff --git a/src/app/other/other.component.ts b/src/app/other/other.component.ts new file mode 100644 index 0000000..afa83a6 --- /dev/null +++ b/src/app/other/other.component.ts @@ -0,0 +1,16 @@ +import { FontSizeService } from './../font-size.service'; +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-other', + templateUrl: './other.component.html', + styleUrls: ['./other.component.css'] +}) +export class OtherComponent implements OnInit { + + constructor(public fontSizeService:FontSizeService) { } + + ngOnInit(): void { + } + +} diff --git a/src/app/task.service.ts b/src/app/task.service.ts deleted file mode 100644 index 0117c35..0000000 --- a/src/app/task.service.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { Injectable } from '@angular/core'; - -import { Task } from './task'; - -@Injectable({ - providedIn: 'root', -}) -export class TaskService { - constructor() {} - - getTasks(): Task[] { - return [ - new Task({ TaskSn: '001', TaskName: '待辦事項 A', State: 'Finish' }), - new Task({ TaskSn: '002', TaskName: '待辦事項 B', State: 'Doing' }), - new Task({ TaskSn: '003', TaskName: '待辦事項 C', State: 'None' }), - new Task({ TaskSn: '004', TaskName: '待辦事項 D', State: 'None' }), - ]; - } -} diff --git a/src/app/task.ts b/src/app/task.ts deleted file mode 100644 index 1ee6859..0000000 --- a/src/app/task.ts +++ /dev/null @@ -1,9 +0,0 @@ -export class Task { - constructor(initData?: Partial) { - Object.assign(this, initData); - } - - TaskSn!: string; - TaskName!: string; - State!: string; -}