指令修饰符的作用
指令修饰符(后文中简称为修饰符)用于对指令的工作方式进行约束声明。
修饰符由框架解析和使用,在指令表达式中无法访问修饰符对象的内容。
除去元指令@raw之外,您可以在任意指令上声明修饰符。
修饰符是指令的可选组成部分,您也可以选择先了解后文中指令实例的内容之后再回来参阅本章节。
指令修饰符的结构
修饰符紧跟在指令名称之后声明,中间不能添加空格。
一个完整的修饰符以符号“#”作为前缀,内容是由“:”分隔的键值对(分别称为修饰符的名字和值):
#key:value
您可以使用任何合法的javaScript字面量作为修饰符的值。如果修饰符值为布尔值true,您也可以省略冒号和修饰符值内容:
#key(:true) // 括号内容为修饰符缺省值
在一个指令上可以同时添加多个修饰符:
$value#input#trim:false
上面的代码在指令“value”上声明了两个修饰符:“input”(值为true)和“trim”(值为false)。
指令修饰符的编码
受限于DOM标签属性和指令声明的语法解析规则,部分特殊字符不能直接用作修饰符内容,否则将导致DOM解析失败或得到非预期的处理结果。
具体地说,如果您需要在指令修饰符中使用“<”,“>”,“:”,“#”,“\”,“/”,空格或者大写字母,那么要对内容进行编码,dagger.js在解析时将对修饰符内容进行解码。例如:
+click#every:["%43aps%4cock","%53hift"]
dagger.js对以上代码解码后将创建一个名为“every”,值为字符串数组“['CapsLock', 'Shift']”的修饰符对象。
对于大写字母,一个可读性更好的编码方式是在字母前加上双下划线“__”前缀作为转换标记,例如:
+click#every:["__caps__lock","__shift"]
dagger.js对以上代码解码后将创建一个名为“every”,值为字符串数组“['CapsLock', 'Shift']”的修饰符对象。
请注意,dagger.js在解析修饰符时会先对具有“-”前缀的字母做大小写转换后再进行解码。因此,修饰符“__caps__lock”将解码为“CapsLock”,而“%2dcaps%2dlock”将解码为“-caps-lock”。
除修饰符外,您也可以在指令名称中使用中横线“-”作为字符大小写转换标记。在布尔指令中我们将看到相关用法。
通用预定义指令修饰符
您可以在控制指令和事件处理指令中使用如下几个通用的预定义修饰符:
1. “once”,布尔类型。once值为true代表其所修饰的指令在宿主元素的整个生命周期内只执行一次。我们来看示例:
2. “name”,字符串类型。您可以使用name修饰符为控制指令和事件处理指令命名。name修饰符主要与remove修饰符配合以动态删除指令。
3. “remove”,字符串或者字符串数组类型。您可以使用remove字段指定一个或多个指令的名称($each指令除外),在当前指令表达式的执行结果为true或其等效值时,dagger.js将动态移除同一个宿主元素上由remove修饰符所指定的指令。我们来看一个示例:
您可以使用这个功能来移除不再需要的高频事件处理方法(如mousemove等)。
除去上述的通用修饰符之外,dagger.js对于某些指令也定义了一些专有的预定义修饰符。这些修饰符我们将在后文的指令实例章节中进行讲解。