index6.html

绑定文本text

gt-text="{属性名}"

绑定标签属性attr

gt-attr="vm属性名称(标签属性,value表达式)"  如 gt-attr="uid(id,'view'+value)"

绑定标签属性css

gt-css="vm属性名称(标签属性,value表达式)"

同attr

绑定标签属性class

1.gt-class="vm属性名称(class名称:value表达式,class名称:value表达式,class名称:value表达式...)"

class 的value表达式比较特殊 value表达式为true 就绑定对应的属性 为fale 就不绑定对应的属性

2.gt-class-属性名="class名称:value表达式,class名称:value表达式,class名称:value表达式..." (可以绑定多个)

<html>
<head>
    <title>grootJs的属性绑定指令</title>
    <script src="jquery-1.11.2.min.js"></script>
    <script src="groot.js"></script>
    <style>
        .back0 {
            background-color: coral;
        }

        .back1 {
            background-color: forestgreen;
        }
    </style>
</head>
<body>
<div gt-view="myview">
    <div gt-css="c(color,value)">你好</div>
    <input gt-attr="uid(id,'view'+value)" type="text" gt-value-change="say"><span gt-text="{uid}+':说'+{say}"></span>

    <div>
        <ul gt-each="list">
           <li gt-class="$index(back0:value % 2 ==0,back1:value % 2==1)"><span gt-text="{$index}+1"></span><span>姓名:</span><span
                    gt-text="{name}"></span>---<span>性别:</span><span
                    gt-text="{sex}"></span></li>
        </ul>
    </div>
</div>
</body>
</html>
<script>
    groot.view("myview", function (vm, ve) {
        vm.list = [
            {"name": "张三", "sex": "男"}
            ,
            {"name": "李四", "sex": "男"}
            ,
            {"name": "王五", "sex": "男"}
        ];
        vm.uid = "123";
        vm.say = "word";
        vm.c = "red"
    })
</script>

grootJs的属性绑定指令的更多相关文章

  1. 【WPF】如何把一个枚举属性绑定到多个RadioButton

    一.说明 很多时候,我们要把一个枚举的属性的绑定到一组RadioButton上.大家都知道是使用IValueConverter来做,但到底怎么做才好? 而且多个RadioButton的Checked和 ...

  2. Knockoutjs实例 - 属性绑定(Bindings)之流程控制(Control flow)

    一.foreach binding 使用此功能可以方便我们循环遍历输出某个数组.集合中的内容. (1).循环遍历输出数组 View Row Code 1 <script type="t ...

  3. 控制文本和外观------Attr Binding(attr属性绑定)

    Attr Binding(attr属性绑定) 目的 attr 绑定提供了一种方式可以设置DOM元素的任何属性值.你可以设置img的src属性,连接的href属性.使用绑定,当模型属性改变的时候,它会自 ...

  4. javascript . 04 匿名函数、递归、回调函数、对象、基于对象的javascript、状态和行为、New、This、构造函数/自定义对象、属性绑定、进制转换

    匿名函数:   没有名字的函数,函数整体加小括号不报错, 函数调用 : a:直接调用 (function (){函数体}) ( ) ; b:事件绑定 document.onlick = functio ...

  5. angular 组件学习-组件内属性绑定

    #组件内的属性(元素的属性)绑定(property binding) 应用场景:通过改变DOM元素的属性,动态显示/隐藏一个元素 知识点:HTML 属性与DOM属性的区别 改变HTMl属性,浏览器需要 ...

  6. LiveBindings --- 把对象之间的属性绑定起来

    有了 FireMonkey 框架,它不同于 VCL ,以往的数据感知控件不能放在它上面,所以 XE2 提供了 LiveBindings 功能作为替代方案.另外它也是个通用的基础设施,同样可用于传统的V ...

  7. vue添加属性绑定

    html <div id="app-2"> <span v-bind:title="message"> 鼠标悬停几秒钟查看此处动态绑定的 ...

  8. angular的属性绑定

    1. 图片地址属性绑定 html文件 <img [src]="imgUrl"> ts文件 export class ProductComponent implement ...

  9. __slots__ 属性绑定

    s = Student() # 创建新的实例 s.name = 'Michael' # 绑定属性'name' s.age = 25 # 绑定属性'age' s.score = 99 # 绑定属性'sc ...

随机推荐

  1. C# 中Switch case 返回不止用break

    Switch(temp) { case "A": //跳出循环 break; case "B": //返回值 return var; case "C& ...

  2. &lt;script type=&quot;text/javascript&quot; src=&quot;&lt;%=path %&gt;/pages/js/arsis/area.js?v=1.01&quot;&gt;&lt;/script&gt; 为什么在最后加? v+1.01

    不写也可以 是为了js改变以后 ,名字未变 ,如果原来有的浏览器加载 了,遇到相同名字的就是引用缓存,不在从新加载.会出现错误.加上后 会重新加载. css 引用后面也一样.

  3. 文件hash数据库

    unit YxdDB; interface uses Windows, Classes, SysUtils, SyncObjs; type TYXDDBValue = packed record Si ...

  4. 分享一个TP5实现Create()方法的心得

    在TP5中发现用不了以前3.X的Create()方法,虽然用input更严谨,但是字段比较多的话还是有些不艺术的3.X中的实现方法如下: $Model = D('User'); $Model-> ...

  5. [python]非常小的下载图片脚本(非通用)

    说在最前面:这不是一个十分通用的下载图片脚本,只是根据我的一个小问题,为了减少我的重复性工作写的脚本. 问题 起因:我的这篇博文什么是真正的程序员浏览量超过了4000+. 问题来了:里面的图片我都是用 ...

  6. [Effective JavaScript 笔记]第41条:将原型视为实现细节

    对象原型链 一个对象给其使用者提供了轻量.简单.强大的操作集.使用者与一个对象最基本的交互是获取其属性值和调用其方法.这些操作不是特别在意属性存储在原型继承结构的哪个位置.随着时间推移,实现对象时可能 ...

  7. lightoj 1020 (博弈)

    思路:很简单的博弈,找出每个人先拿的必胜态进行状态转移即可. #include<cstdio> #include<string> #include<cstring> ...

  8. jail brak 获取当前安装app列表

    ios 5 6 7 可以通过解析"/private/var/mobile/Library/Caches/com.app.mobile.installation.plist" 文件获 ...

  9. Asp.Net MVC学习总结(三)——过滤器你怎么看?

    一.过滤器简介 1.1.理解什么是过滤器 1.过滤器(Filters)就是向请求处理管道中注入额外的逻辑.提供了一个简单而优雅的方式来实现横切关注点. 2.所谓的过滤器(Filters),MVC框架里 ...

  10. 【转】Java线程面试题 Top 50

    不管你是新程序员还是老手,你一定在面试中遇到过有关线程的问题.Java语言一个重要的特点就是内置了对并发的支持,让Java大受企业和程序员的欢迎.大多数待遇丰厚的Java开发职位都要求开发者精通多线程 ...