From 0a3df53ef869ca5fb424a1de0089897defa8e60c Mon Sep 17 00:00:00 2001 From: "YLHEALTH\\jackson.li" Date: Fri, 4 Jan 2019 17:47:55 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=8B=E7=A6=AE=E6=8B=9C=E7=9B=A1=E5=8F=AF?= =?UTF-8?q?=E8=83=BD=E6=8A=8A=E5=AE=83=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/app-path.const.ts | 4 ++- src/app/app-routing.module.ts | 4 +++ src/app/app.component.html | 1 + src/app/app.module.ts | 2 +- src/app/home/dataList.const.ts | 2 +- src/app/home/home.component.html | 49 +++++++++++++++++++------------- src/app/home/home.component.ts | 2 ++ src/app/p2/p2.component.html | 1 + src/app/p2/p2.component.ts | 1 - src/app/p3/p3.component.html | 2 +- src/app/p4/p4-routing.module.ts | 16 +++++++++++ src/app/p4/p4.component.css | 0 src/app/p4/p4.component.html | 18 ++++++++++++ src/app/p4/p4.component.ts | 35 +++++++++++++++++++++++ src/app/p4/p4.module.ts | 16 +++++++++++ 15 files changed, 128 insertions(+), 25 deletions(-) create mode 100644 src/app/p4/p4-routing.module.ts create mode 100644 src/app/p4/p4.component.css create mode 100644 src/app/p4/p4.component.html create mode 100644 src/app/p4/p4.component.ts create mode 100644 src/app/p4/p4.module.ts diff --git a/src/app/app-path.const.ts b/src/app/app-path.const.ts index 8447907..d2f6e5f 100644 --- a/src/app/app-path.const.ts +++ b/src/app/app-path.const.ts @@ -4,6 +4,8 @@ export const appPath = { p2: 'p2', - p3: 'p3' + p3: 'p3', + + p4: 'p4' }; diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 93e8408..d22388f 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -14,6 +14,10 @@ const routes: Routes = [ { path: appPath.p3, loadChildren: './p3/p3.module#P3Module' + }, + { + path: appPath.p4, + loadChildren: './p4/p4.module#P4Module' } ]; diff --git a/src/app/app.component.html b/src/app/app.component.html index d2f19ee..3e5b28e 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -4,6 +4,7 @@
  • 練習一
  • 練習二
  • 練習三
  • +
  • 練習四
  • diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 2c3ba29..9db90f0 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -6,7 +6,7 @@ import { AppComponent } from './app.component'; @NgModule({ declarations: [ - AppComponent + AppComponent, ], imports: [ BrowserModule, diff --git a/src/app/home/dataList.const.ts b/src/app/home/dataList.const.ts index 4d01121..baabc23 100644 --- a/src/app/home/dataList.const.ts +++ b/src/app/home/dataList.const.ts @@ -8,7 +8,7 @@ export const dataList = [ 'lat': 51.5085 }, 'country': 'GB', - 'population': 0 + 'population': 0, }, 'cod': '200', 'message': 0.0597013, diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index cf5a344..ec12856 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -1,4 +1,12 @@

    題一

    +

    關於這一題我看了很多網站但還是解決不出來,我分別在iT邦幫忙和stackOverflow提問
    + stackoverflow +
    iT邦幫忙 +
    ,照著他們的解答我依舊無法解決問題十分抱歉 +
    我認為問題點在於我無法將associative array插進第二個table裡面(第一個table可以),我嘗試過使用
    +*ngFor *ngif並用、
    +ng-container
    但依舊無法,請bass姐賜教 +

    cnt:
    城市資訊;
    @@ -52,58 +60,59 @@ cnt:
    - - + - + +
    icon
    - {{item.list_.dt}} +
    + {{ l.dt * 1000 | date:'yyyy-MM-dd hh:mm:ss'}} - {{item.list_.temp.day}} °C + {{ l.day }} °C - {{item.list_.temp.min}} °C + {{item.list_}} °C - {{item.list_.temp.max }} °C + {{item.list_ }} °C - {{item.list_.temp.night }} °C + {{item.list_ }} °C - {{item.list_.temp.eve }} °C + {{item.list_ }} °C - {{item.list_.temp.morn }} °C + {{item.list_ }} °C - {{item.list_.pressure}} hpa + {{item.list_}} hpa - {{item.list_.humidity}} % + {{item.list_}} % - {{item.list_.weather.id }} + {{item.list_ }} - {{item.list_.weather.main }} + {{item.list_ }} - {{item.list_.weather.description }} + {{item.list_ }} - {{item.list_.weather.icon }} + {{item.list_ }} - {{item.list_.speed}} meter/sec + {{item.list_}} meter/sec - {{item.list_.deg}} ° + {{item.list_}} ° - {{item.list_.clouds}} % + {{item.list_}} % - {{item.list_.rain}} + {{item.list_}}

    diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 46547fa..0d2deb4 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { dataList } from './dataList.const'; + @Component({ selector: 'app-home', templateUrl: './home.component.html', @@ -10,6 +11,7 @@ export class HomeComponent implements OnInit { list = dataList; + constructor() { } ngOnInit() { diff --git a/src/app/p2/p2.component.html b/src/app/p2/p2.component.html index 7bb7849..3601968 100644 --- a/src/app/p2/p2.component.html +++ b/src/app/p2/p2.component.html @@ -1,4 +1,5 @@

    題二

    +

    尚未將刪除功能做出、隱藏及加總功能也還沒,十分抱歉

    單品:
    diff --git a/src/app/p2/p2.component.ts b/src/app/p2/p2.component.ts index 17201c4..da280f7 100644 --- a/src/app/p2/p2.component.ts +++ b/src/app/p2/p2.component.ts @@ -49,7 +49,6 @@ export class P2Component implements OnInit { } totalPrice(){ - return '算不出來'; } deleteItem(name): void { diff --git a/src/app/p3/p3.component.html b/src/app/p3/p3.component.html index 833a04a..d9014b2 100644 --- a/src/app/p3/p3.component.html +++ b/src/app/p3/p3.component.html @@ -1,5 +1,5 @@

    題三

    - +

    sorry

    寬度 :
    高度 :
    diff --git a/src/app/p4/p4-routing.module.ts b/src/app/p4/p4-routing.module.ts new file mode 100644 index 0000000..ec62924 --- /dev/null +++ b/src/app/p4/p4-routing.module.ts @@ -0,0 +1,16 @@ +import { NgModule } from '@angular/core'; +import { Routes, RouterModule } from '@angular/router'; +import { P4Component } from './p4.component'; + +const routes: Routes = [ +{ + path: '', + component: P4Component +} +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule] +}) +export class P4RoutingModule { } diff --git a/src/app/p4/p4.component.css b/src/app/p4/p4.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/p4/p4.component.html b/src/app/p4/p4.component.html new file mode 100644 index 0000000..aa03eb8 --- /dev/null +++ b/src/app/p4/p4.component.html @@ -0,0 +1,18 @@ +
    輸入欄位驗證
    +

    十分抱歉,不夠時間完成

    + + + 製作三個directive 輸入欄位驗證
    + 一.必須輸入大於0,若輸入小於或等於0,則alert訊息
    + 二.只能輸入數字,若輸入欄位不符,則alert訊息
    + 三.只能輸入英文兩碼+數字三碼,若輸入欄位不符,則alert訊息
    + +
    + 欄位一 :

    + 欄位二 :

    + 欄位三 : + diff --git a/src/app/p4/p4.component.ts b/src/app/p4/p4.component.ts new file mode 100644 index 0000000..b08bc54 --- /dev/null +++ b/src/app/p4/p4.component.ts @@ -0,0 +1,35 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-p4', + templateUrl: './p4.component.html', + styleUrls: ['./p4.component.css'] +}) +export class P4Component implements OnInit { + + number = ''; + value2: any; + + addNumber(inputRef: HTMLInputElement): void { + console.log(inputRef.value); + inputRef.value = ''; + + inputRef.value = this.value2; + + if ( + this.value2 = 0 + ) { + alert('good'); + } else { + alert('請輸入0'); + } + } + + + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/p4/p4.module.ts b/src/app/p4/p4.module.ts new file mode 100644 index 0000000..6104f50 --- /dev/null +++ b/src/app/p4/p4.module.ts @@ -0,0 +1,16 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { FormsModule } from '@angular/forms'; + +import { P4RoutingModule } from './p4-routing.module'; +import { P4Component } from 'src/app/p4/p4.component'; + +@NgModule({ + declarations: [P4Component], + imports: [ + CommonModule, + P4RoutingModule, + FormsModule + ] +}) +export class P4Module { } -- 2.26.2