avalonjs学习笔记（四）

四，一些特殊的绑定

1，ms-if

我不知道这个设计是用来做什么用的，我看的结果就是显示隐藏用，当绑定的值不是true的时候，这个标签就不会被显示出来

2，ms-visible

貌似这个才是真正显示隐藏用的，跟ms-if的差别，貌似很深奥，表示不懂。

3，循环绑定

循环有两种，一个使用ms-each-item

    
    
    


 

    
{{ item }} --- {{$index}}

 
 

在ul标签设置了ms-each-item，然后这个标签里面的东西就会被按照array的数量进行重复。

item是array里的每个项的值。这个是可以指定的ms-each-abc的话，abc就代表了这个值。如果不写，el代表了这个值

$index就是array的索引。

第二种方法是ms-repeat，貌似和ms-each用法完全一样。。。

貌似执行顺序会不一样，但是，现在不用太关心吧

4，ms-duplex

这个就是用来绑定输入框什么的，做到界面输入了后台就可以改，然后后台变了就可以显示到画面上。叫双向绑定比较好？

还有一些辅助的属性，比如

有data-duplex-event为change的话，就是要回车才变化

不加的那个，只要一改就变化

5，ms-css，ms-attr

这两个貌似就是用来替代css和html里原生属性的，用这个，就可以用viewmodel来绑定样式什么的

比如

Html：

    

        
Row 1, cell 1
        
Row 1, cell 2
    
    

        
{{borderthickness}}
    

viewmodel:

        avalon.define("tablevm",function(ob){
            ob.borderthickness=2,
            ob.background="blue"
        })

 

table的border用的就是通过ms-attr绑定到viewmodel的borderthickness上

然后第一个单元格的background-color绑定到viewmodel的background上

6，事件的绑定

就是什么onclick之类的，全都有对应的ms-xxx，用来绑定viewmodel里的方法。

例如：

然后viewmodel是这样的

        avalon.define("myvm",function (ob){
            ob.visible=false,
            ob.click=function(){
                ob.visible=!ob.visible
            }
        })