指令 - Julienedies/brick GitHub Wiki

概念

指令是一种关联js和dom的方式。通常通过html属性的方式声明和绑定到一个dom元素上。

在指令的背后通常是对dom进行某种操作的js代码。

其实html元素中有很多属性都可以理解成一个指令。譬如一个文本输入框的maxlength属性可以定义最大输入字符长度;有title属性的元素会在鼠标滑入的时候显示title属性包含的字符串;一个有href属性的链接被点击之后进入到href属性指向的新页面,这些统统可以理解为指令。只不过这些指令对应的行为是由浏览器实现的。

在brick中,指令通过html属性的方式被声明。譬如通过书写以下html代码,就会生成一个分页控件:

                <div class="pagination"
                     ic-pagination="companies"
                     ic-pagination-rows="30"
                     ic-pagination-total="32"
                     ic-pagination-step="10" >
                    <span class="prev" ic-role-pagination-prev>&lt;</span>
                    <span class="ellipsis" ic-role-pagination-ellipsis>...</span>
                    <span class="num" ic-role-pagination-num="{{}}">{{}}</span>
                    <span class="next" ic-role-pagination-next>&gt;</span>
                </div>

查看效果

自定义指令

brick中通过brick.directives.reg方法注册指令;

brick.directives.reg('ic-on-enter-press',  function($elm, attrs) {
	        	var call = jQuery.proxy(scope.enterPress,element);
	        	
	        	var fn = function(e){
	        		if(e.which == 13){
	        			scope.enterPress();
	        		}		
	        	};
	        	
	        	$elm.focus(function(){
	        		elm.keypress(fn);
	        	});
	        	$elm.blur(function(){
	        		elm.unbind('keypress',fn);
	        	});        	
	        	
	        });

内置widget类型指令

⚠️ **GitHub.com Fallback** ⚠️