From 3b42d864e64450eb03979b9ba9cf409e56a5fedf Mon Sep 17 00:00:00 2001
From: "YLHEALTH\\jackson.li" <jackson09@live.hk>
Date: Thu, 10 Jan 2019 16:03:35 +0800
Subject: [PATCH] =?UTF-8?q?=E7=B7=B4=E7=BF=92=E4=BA=8C=20almost=20done?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/home/home.component.html |  6 +++---
 src/app/home/home.component.ts   |  2 +-
 src/app/p2/p2.component.html     |  6 ++++--
 src/app/p3/imageUrl              |  0
 src/app/p3/p3.component.html     | 10 +++++++---
 src/app/p3/p3.component.ts       |  6 +++---
 src/app/p4/p4.component.html     |  2 +-
 src/app/p4/p4.component.ts       | 24 +++++++++++++++++++-----
 8 files changed, 38 insertions(+), 18 deletions(-)
 create mode 100644 src/app/p3/imageUrl

diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html
index a6e014d..5acc7ff 100644
--- a/src/app/home/home.component.html
+++ b/src/app/home/home.component.html
@@ -53,7 +53,7 @@ cnt:<input type="number" min="1" max="7"><br>
       <th>icon</th>
   </tr>
 
-  <!-- TODO  尚欠icon-->
+  <!-- TODO  尚欠icon display-->
 
   <tbody *ngFor = "let l of list">
       <tr *ngFor = "let item of l.list_">
@@ -94,7 +94,7 @@ cnt:<input type="number" min="1" max="7"><br>
               {{ item2.description }}
           </td>
           <td>
-              {{ pic }}
+              <img [src]="pic">
           </td>
           <td>
               {{ item.speed }} meter/sec
@@ -113,7 +113,7 @@ cnt:<input type="number" min="1" max="7"><br>
 
 
   </tbody>
-  <!-- <tr *ngFor = "let item of list[0].list_">
+  <!--<tr *ngFor = "let item of list[0].list_">
       <td>
           {{item | json }}
 			</td>
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts
index 1c22205..6629c97 100644
--- a/src/app/home/home.component.ts
+++ b/src/app/home/home.component.ts
@@ -10,7 +10,7 @@ export class HomeComponent implements OnInit {
 
   list = dataList;
 
-  pic = Image['./01d.png'];
+  pic = './01d.png';
 
   constructor() { }
 
diff --git a/src/app/p2/p2.component.html b/src/app/p2/p2.component.html
index 6d940f9..d2a8f4f 100644
--- a/src/app/p2/p2.component.html
+++ b/src/app/p2/p2.component.html
@@ -1,7 +1,9 @@
 <p style="color:green">題二</p>
-<p>尚餘隱藏功能</p>
 <form (ngSubmit)="addData()">
-<!-- ToDo 隱藏字句（下方[hidden]，設name == null 依舊會display） -->
+<!-- ToDo 隱藏字句
+  問題1、（下方[hidden]，設name == null 依舊會display）
+  問題2、在component.ts設定的buildMessage之訊息無法秀出
+-->
 
   單品：<input type="text" name="name" [(ngModel)]="name" (change)="bulidMessage()" ><br>
   單價：<input type="number" name="price" min="1" [(ngModel)]="price" (change)="bulidMessage()"><br>
diff --git a/src/app/p3/imageUrl b/src/app/p3/imageUrl
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/p3/p3.component.html b/src/app/p3/p3.component.html
index 833a04a..cfb6327 100644
--- a/src/app/p3/p3.component.html
+++ b/src/app/p3/p3.component.html
@@ -1,6 +1,10 @@
 <p style="color:green">題三</p>
 
-  寬度 : <input type="number" min="1" ><br>
-  高度 : <input type="number" min="1" ><br>
-  <img [src]="imageUrl">
+<!-- 圖片無法顯示QQ -->
+  寬度 : <input type="number" min="1" step="5" ><br>
+  高度 : <input type="number" min="1" step="5"><br>
+  <img src ="imageUrl">
+  <img [src]=" imageUrl ">
+  <img bind-src="imageUrl ">
+
 <router-outlet></router-outlet>
diff --git a/src/app/p3/p3.component.ts b/src/app/p3/p3.component.ts
index 269bcef..aada6a6 100644
--- a/src/app/p3/p3.component.ts
+++ b/src/app/p3/p3.component.ts
@@ -9,14 +9,14 @@ export class P3Component implements OnInit {
 
   widthLength = '1024';
   heightLength = '768';
-  imageUrl = 'http://lorempixel.com//{{widthLength}}/{{heightLength}}/';
+  imageUrl = 'http://lorempixel.com/{{widthLength}}/{{heightLength}}/';
 
   showPic() {
     if (this.widthLength !== null && this.heightLength !== null &&
       this.widthLength !== undefined && this.heightLength !== undefined) {
-      this.imageUrl = "http://lorempixel.com/" + this.widthLength + "/" + this.heightLength + "/";
+      this.imageUrl = 'http://lorempixel.com/' + this.widthLength + '/' + this.heightLength + '/';
     } else {
-      alert("長度或高度不得為空!");
+      alert('長度或高度不得為空!');
     }
   }
 
diff --git a/src/app/p4/p4.component.html b/src/app/p4/p4.component.html
index 43b6b25..ed4a377 100644
--- a/src/app/p4/p4.component.html
+++ b/src/app/p4/p4.component.html
@@ -5,7 +5,7 @@
   一.必須輸入大於０，若輸入小於或等於0，則alert訊息<br>
   二.只能輸入數字，若輸入欄位不符，則alert訊息<br>
   三.只能輸入英文兩碼＋數字三碼，若輸入欄位不符，則alert訊息</table>
-
+<!-- TODO 卡在ts檔的if else語法-->
 <br>
   欄位一 : <input class="test"
             placeholder="輸入後請按enter"
diff --git a/src/app/p4/p4.component.ts b/src/app/p4/p4.component.ts
index 9c60bc7..4b006c3 100644
--- a/src/app/p4/p4.component.ts
+++ b/src/app/p4/p4.component.ts
@@ -17,11 +17,11 @@ export class P4Component implements OnInit {
     this.value2 = new Number(inputRef.value);
 
     if (
-      this.value2 === 0
+      this.value2 > 0
     ) {
-      alert('good');
+      alert('輸入正確');
     } else {
-    alert('請輸入0');
+    alert('請輸入大於0的數字');
     }
   }
 
@@ -34,12 +34,26 @@ export class P4Component implements OnInit {
     if (
       this.value2 !== Number
     ) {
-      alert('bye');
+      alert('只能輸入數字');
     } else {
-    alert('okay~');
+    alert('輸入正確');
     }
   }
 
+  addNumber3(inputRef: HTMLInputElement): void {
+    console.log(inputRef.value);
+    inputRef.value = '';
+
+    this.value2 = new Number(inputRef.value);
+
+    if (
+      this.value2 !== Number
+    ) {
+      alert('只能輸入數字');
+    } else {
+    alert('輸入正確');
+    }
+  }
 
 
   constructor() { }
-- 
2.26.2