avalon綁定屬性總結

$model(全部非$屬性),$event(事件對象)

一、做用域圈定

ms-controller：按着就近原則自下而上掃描DOM樹

ms-important：僅掃描本節點及之下做爲掃描區

ms-skip：使綁定失效

二、ms-duplex雙向綁定屬性：除了綁定（VM同步數據到V）數據到DOM節點中，還會偷偷在節點上綁定一個監聽事件，當節點數據發生變化時，及時把V中的數據同步到VM中

(1)text,password,textarea要求綁定值爲一個字符串(ms-duplex-text)

(2)radio:綁定爲boolean(ms-duplex-boolean)

(3)checkbox:綁定爲數組(ms-duplex-string)

(4)select:綁定爲字符串或者數組(ms-duplex-string)

後邊是ms-duplex2.0綁定屬性

 

三、ms-visible：相似toggle,表達式爲true顯示,經過把display設置爲block或者none顯示或隱藏

 

四、插入移除處理ms-if:添加節點元素顯示元素，設置<!--ms-if-->註釋隱藏節點（刪除節點）

 

五、數據緩存ms-data-*,保存對象或者數組使用ms-data（綁定在DOM節點對象上而不是做爲屬性），保存在節點上，顯示時處理返回，綁定爲data-*屬性

 

六、屬性操做ms-class(class),ms-duplex(value),ms-attr,ms-href,ms-src

    boolean屬性：ms-attr-disabled,ms-attr-readonly,ms-attr-selected,ms-attr-checked

    字符串固有屬性：ms-attr-id,ms-attr-name,ms-attr-title,ms-src,ms-href

    自定義屬性：ms-attr-data-url，ms-attr-data-id

      

     ms-class:   ms-class='active'  ms-class='active:isOk'

     ms-active,ms-hover

 

七、ms-duplex2.0

     ms-duplex-string,ms-duplex-number,ms-duplex-checked,ms-duplex-boolean,ms-data-duplex

     輔助data-duplex-focus,data-duplex-changed,data-duplex-event

 

八、樣式操做：ms-css(內聯)，ms-class(外部引入)

<button ms-click="toggle" ms-css-width="100">顯示</button> <span ms-if="flag">{{message}}</span>

九、事件綁定：ms-on-eventName,ms-eventName

    ms-mouseenter,ms-mouseleave(僅做用於被選元素)，ms-input(ms-on-input)，多事件綁定順序與天然數無關，與事件順序有關

十、循環操做
    ms-each-遍歷臨時變量（在父級元素上綁定）

    ms-repeat-遍歷臨時變量（在子元素上綁定）

    ms-with-遍歷臨時變量（在父級元素上綁定）

    數組：el默認臨時變量，$index當前元素的索引，$first是否爲第一個元素boolean,$last,$remove返回一個function刪除當前元素，$outer內層循環外層循環變量

    哈希（對象）：$key鍵名,$val鍵值,$outer    （$outer.$index）

<ul>  <li ms-repeat-e="data">{{e}}</li> </ul> <ul ms-each-e="data">  <li>{{e}}</li> </ul>

修改對象的鍵值：

修改對象的鍵值對：

修改數組的值：數組對象.set(下標，值)

修改數組中對象值:數組對象[下標].鍵名 = 鍵值；

 

遍歷回調函數(屬性)

data-each-rendered

data-with-rendered

data-repeat-rendered

data-with-sorted

 

循環時使用size計算數據長度,而不是length,使用ms-if-loop而不是ms-if,由於ms-if優先於ms-repeat執行

 

十一、模版引用

 

十二、屬性監聽

 

1三、模塊通訊