6: Get Data from a Server

[examples/angular-tour-of-heroes] / src / app / hero-search / hero-search.component.html

diff --git a/src/app/hero-search/hero-search.component.html b/src/app/hero-search/hero-search.component.html
new file mode 100644 (file)
index 0000000..cce6288
--- /dev/null
+++ b/src/app/hero-search/hero-search.component.html
@@ -0,0 +1,13 @@
+<div id="search-component">
+  <h4><label for="search-box">Hero Search</label></h4>
+
+  <input #searchBox id="search-box" (input)="search(searchBox.value)" />
+
+  <ul class="search-result">
+    <li *ngFor="let hero of heroes$ | async" >
+      <a routerLink="/detail/{{hero.id}}">
+        {{hero.name}}
+      </a>
+    </li>
+  </ul>
+</div>