(應用的「外殼」)
1、新建專案:
2、進入專案目錄,並啟動這個應用。
3、新增乙個標題
(英雄編輯器)
1、建立元件 myheros
2、在 myheroes.component.ts 中定義陣列
3、在 myheroes.component.html中使用並繫結陣列的值,通過 ([ngmodel]) 繫結input可修改值
我這裡省略了angular官網上的把乙個步驟:建立乙個類 ,下面簡單補充一下建立和使用這個類:
在要使用到hero
類的元件裡要 import 這個 hero.ts ,比如在 myheroes.component.ts 中; import from '../hero.service';
使用hero
類:hero: hero = ;
(顯示英雄列表)
1、定義乙個陣列heros
,通過 *ngfor 迴圈,在標籤上展示出單個hero
的屬性
2、在標籤上新增click
事件繫結,通過點選這個事件在下面展示出被點選的這一項
3、新增click
事件處理器,在這裡給 selectedhero 賦值
3、使用*ngif
隱藏空白的詳情
4、給所選英雄新增樣式
( 主從元件)
1、新建乙個名叫hero-detail
的新元件 ng g component hero-detail
2、從heroescomponent
模板的底部把表示英雄詳情的 html **剪下貼上到所生成的herodetailcomponent
模板中
3、所貼上的 html 引用了selectedhero
。 但是,新的herodetailcomponent
可以展示任意英雄,而不僅僅所選的。因此還要把模板中的所有selectedhero
替換為item
。
1、在myheros.component.html 中新增 herodetail的佔位符: <
[item]
="selectedhero"
>
>
2、在heros.detail.component.ts 中新增個帶有@input()
裝飾器的 item屬性,這個元件所做的只是通過hero
屬性接收乙個英雄物件,並顯示它。 @input() item;
(2)元件通訊有兩種方式:父到子(用@input裝飾器) 、 子到父(用@output裝飾器)
語法: @input() name: number;
10 10 010 簡介 官網 官網翻譯
netty是 乙個非同步事件驅動的網路應用程式框架,用於快速開發可維護的高效能協議伺服器和客戶端。netty是乙個nio客戶端伺服器框架,可以快速輕鬆地開發協議伺服器和客戶端等網路應用程式。它極大地簡化並簡化了tcp和udp套接字伺服器等網路程式設計。快速簡便 並不意味著最終的應用程式會受到可維護性...
Angular2官網專案 第一天
來自官網 這篇 英雄指南 涵蓋 了 angular 的核心原理。這次構建的應用會涉及很多特性 獲得並顯示英雄列表,編輯所選英雄的詳情,並在英雄資料的多個檢視之間建立導航。這些特性,在成熟的 資料驅動的應用中經常見到。完成本教程後,我們將學習足夠的 angular 核心技術,並確信 angular 確...
Robolectric Shadows 官網翻譯
robolectric 通過建立乙個包含真實android 框架 的執行時環境來進行工作。這意味著,當你的測試或被測試 呼叫到android框架時,你會獲得更真實的體驗,因為這跟在實際裝置上執行的大部分 都是相同的。然而還是有一些限制 native code 源 android源 不能在你的開發機器...