來自官網:
這篇《英雄指南》涵蓋`了 angular 的核心原理。這次構建的應用會涉及很多特性：獲得並顯示英雄列表，編輯所選英雄的詳情，並在英雄資料的多個檢視之間建立導航。這些特性，在成熟的、資料驅動的應用中經常見到。
完成本教程後，我們將學習足夠的 angular 核心技術，並確信 angular 確實能做到我們需要它做的。 我們將涵蓋大量入門級知識，同時我們也會看到大量鏈結，指向更深入的章節。
一 ：為本地開發搭建環境
a.檢查@angular/cli版本.
在命令列輸入 ng -v -----版本號必須大於1.0.0-beta.24
b.新建工程
工程所在目錄，命令列
ng new 專案名稱 --style=scss
帶style引數原因：ng-bootstrap要求使用scss（scss--》css的預編譯語言
c.執行專案
命令列進入你的專案根目錄
執行 cnpm start
在瀏覽器輸入http://localhost:4200/
d.布局會引用bootstrap布局（引入bootstrap外掛程式）
只使用它的css和一些圖示樣式---->只需引入css檔案和fonts檔案
1.在src/assets檔案下建立bootstrap資料夾
目錄結構:
-assets
-bootstrap
-css
-bootstrap.min.css
-fonts
3.瀏覽器頁面呈現出圖示。引入bootstrap成功。
二:顯示此英雄
export
class`
儲存後，瀏覽器應自動重新整理，顯示標題和英雄。
這裡的雙大括號是angular中的插值表示式繫結語法。它們表示元件的title和hero屬性的值會作為字串插入到html標籤中間。
三:general物件
建立一bean資料夾(用於存放資料模型)
./src/bean/general.ts
建立general.ts
export class general}引入
import from "../bean/general";
general
:general=;
四；編輯英雄名字
使用者應該能在乙個輸入框中編輯英雄的名字。 當使用者輸入時，這個輸入框應該能同時顯示和修改英雄的name屬性。
也就是說，我們要在表單元素和元件的hero.name屬性之間建立雙向繫結。
雙向繫結
[(ngmodel)]是乙個angular語法，用與把hero.name繫結到輸入框中。 它的資料流是
雙向的：從屬性到輸入框，並且從輸入框回到屬性。
雖然ngmodel是乙個有效的angular指令，但它預設情況下卻是不可用的。 它屬於乙個可選模組formsmodule。 我們必須選擇使用那個模組。
注意:
引入
//雙向資料繫結依賴的模組
import from '@angular/forms';
imports: [
browsermodule,
formsmodule]
name:
[(ngmodel)]=
"general.name"
placeholder
="name"
>
五:顯示我們的英雄
建立data資料夾(用於存放資料)
./src/data/mock-general.ts
建立mock-general.ts
import from '../bean/general';
export const generals:general=[
new general(11,"孫武",'春秋'),
new general(12,"白起",'秦'),
new general(13,"霍去病",'西漢'),
new general(14,"馬援",'東漢'),
new general(15,"謝玄",'兩晉'),
new general(16,"張須陀",'隋'),
new general(17,"李靖",'唐'),
new general(18,"薛仁貴",'唐'),
new general(19,"岳飛 ",'宋'),
new general(20,"戚繼光",'明'),
];heroes是乙個由hero類的例項構成的陣列，我們在第一部分定義過它。 我們當然希望從乙個 web 服務中獲取這個英雄列表，但別急，我們得把步子邁得小一點，先用一組模擬出來的英雄。
1.匯入import from "../data/mock-general";
import from '@angular/core';
title = 'my general';
// generals:general=generals;
generals:general;
ngoninit()
}*ngfor 官網
當瀏覽器重新整理時，我們就看到了英雄列表
Angular學習筆記（第一天）
1 概述 框架 是一套優秀的 集合，需要學習框架的理念，再按照框架的規則和語法要求來使用框架 來完成快速開發 庫。09年 由google所推出的js框架，採用模組化的開發方式，在各個模組中 來封裝元件 服務 指令 管道等來實現業務功能。3 與vue對比 vue 整個應用全是元件 angular 整個...
上海 專案 第一天
勞累了一晚飛抵上海,終於這麼過去了第一天.一天的時間不長,到了客戶處,才發現環境竟然完全不具備 操作間 一間會議室 的網路不通,根本沒辦法幹活.弄了老半天不成,說改無線.無線也悽慘.一連就斷.要換位置換到一定的方位才上去了.伺服器沒準備好.下午好不容易伺服器裝上了2003.想著去擺弄擺弄,卻不認手頭...
專案入手第一天
2018 3 16從上乙份工作離職，之後在家窩了幾天，外帶找房子倆天，最後墨跡了乙個禮拜吧，終於等到和媳婦的蜜月之行。巴厘島的風景優美，天氣濕潤，對 的養護真不錯！從巴厘島回來後，本來就不白的身體就更黑了。回來後休息了幾天就開始找工作。這找工作的歷 是辛酸。4月初開始找工作，到月底入職。更開始沒有複...