Angular學習筆記 三 之雙向繫結

首先，先看angular官方中對資料繫結的描述：

資料繫結是一種機制，用來協調使用者可見的內容，特別是應用資料的值。 雖然也可以手動從 html 中推送或拉取這些值，但是如果將這些任務轉交給繫結框架，應用就會更易於編寫、閱讀和維護。 你只需宣告資料來源和目標 html 元素之間的繫結關係就可以了，框架會完成其餘的工作。

在了解雙向繫結前，先看看angular中都有哪幾種資料繫結：

angular 提供了多種資料繫結方式。繫結型別可以分為三類，按資料流的方向分為：

繫結型別

語法分類

插值屬性

attribute

css 類

樣式

content_copy}

[target]="expression"
bind-target="expression"

到檢視事件

content_copy(target)="statement"

on-target="statement"

雙向

content_copy[(target)]="expression"

bindon-target="expression"

繫結的「目標」是繫結符內部的屬性或事件：、()或[()]。

在繫結時可以使用**指令的每個公共成員。 你無需進行任何特殊操作即可在模板表示式或語句內訪問指令的成員。

通過上表的描述，我們知道了從資料來源到檢視用的是，然後從檢視到資料來源用的是（）,那麼就知道了為什麼雙向繫結用符號[(target)]了，按照順序也應該是中括號在外面，小括號在裡面吧，呵呵，開玩笑，反正我是這麼記得，記住就行。。

了解了上面的理論知識，操作起來其實很簡單

ng new angulardemo

ng g component form

import  from '@angular/platform-browser';

import from '@angular/core';
import from './demo/form/form.component';
import from '@angular/forms';
@ngmodule()

*

ul,li
h2.people_list
.people_list li
.people_list li .fonm_input
.people_list submit

import  from '@angular/core';

@component()
export class formcomponent implements oninit , , ],
mark: ''
};constructor() 
ngoninit() 
dosubmit()
}

獲取表單的值}

angular2 學習筆記（三）

建立的angular2專案中，在src資料夾中 main.ts 固定以下 主要是為了啟動頁面 import from angular platform browser dynamic platformbrowserdynamic import from angular core import fro...

Angular學習筆記 Angular生命週期

生命週期函式通俗的講就是元件建立 元件更新 元件銷毀的時候會觸發的一系列的方法。當 angular 使用建構函式新建乙個元件或指令後，就會按下面的順序在特定時刻呼叫這些生命週期鉤子方法。當 angular 使用建構函式新建乙個元件或指令後，就會按下面的順序在特定時刻呼叫這些生命週期鉤子方法 鉤子用途...

Angular學習筆記

1.nodejs 2.npm 3.cnpm 4.yarn 4.vscode 1.建立專案的 命令 ng new project name style scss 引數 style 使用的css型別,可以是css,sacc,scss,less,預設值是css 2.初始化node modules 命令 1...