angular.js/src/directives.js

153 lines
4.2 KiB
JavaScript
Raw Normal View History

2010-03-22 20:58:04 +00:00
angularDirective("ng-init", function(expression){
2010-03-16 17:30:26 +00:00
return function(){
2010-03-22 20:58:04 +00:00
this.$eval(expression);
2010-03-16 17:30:26 +00:00
};
});
2010-03-22 20:58:04 +00:00
angularDirective("ng-eval", function(expression){
2010-03-16 17:30:26 +00:00
return function(){
2010-03-22 20:58:04 +00:00
this.$addEval(expression);
};
2010-03-16 17:30:26 +00:00
});
2010-03-22 22:46:34 +00:00
angularDirective("ng-bind", function(expression){
2010-03-22 20:58:04 +00:00
return function(element) {
2010-03-16 17:30:26 +00:00
this.$watch(expression, function(value){
2010-03-22 20:58:04 +00:00
element.text(value);
2010-03-16 17:30:26 +00:00
});
};
});
2010-03-22 22:46:34 +00:00
angularDirective("ng-bind-attr", function(expression){
2010-03-22 20:58:04 +00:00
return function(element){
this.$watch(expression, bind(element, element.attr));
2010-03-16 17:30:26 +00:00
};
});
2010-03-22 22:46:34 +00:00
angularDirective("ng-non-bindable", function(){
2010-03-22 20:58:04 +00:00
this.descend(false);
});
2010-03-22 22:46:34 +00:00
angularDirective("ng-repeat", function(expression, element){
2010-03-22 20:58:04 +00:00
var reference = this.reference("ng-repeat: " + expression),
r = element.removeAttr('ng-repeat'),
template = this.compile(element),
2010-03-22 22:46:34 +00:00
match = expression.match(/^\s*(.+)\s+in\s+(.*)\s*$/),
lhs, rhs, valueIdent, keyIdent;
if (! match) {
throw "Expected ng-repeat in form of 'item in collection' but got '" +
expression + "'.";
}
lhs = match[1];
rhs = match[2];
match = lhs.match(/^([\$\w]+)|\(([\$\w]+)\s*,\s*([\$\w]+)\)$/);
if (!match) {
throw "'item' in 'item in collection' should be identifier or (key, value) but got '" +
keyValue + "'.";
}
valueIdent = match[3] || match[1];
keyIdent = match[2];
2010-03-22 20:58:04 +00:00
var parent = element.parent();
element.replaceWith(reference);
2010-03-16 17:30:26 +00:00
return function(){
2010-03-22 20:58:04 +00:00
var children = [],
currentScope = this;
this.$addEval(rhs, function(items){
var index = 0, childCount = children.length, childScope, lastElement = reference;
2010-03-22 22:46:34 +00:00
foreach(items || [], function(value, key){
2010-03-22 20:58:04 +00:00
if (index < childCount) {
// reuse existing child
childScope = children[index];
} else {
// grow children
childScope = template(element.clone(), currentScope);
childScope.init();
childScope.scope.set('$index', index);
childScope.element.attr('ng-index', index);
lastElement.after(childScope.element);
children.push(childScope);
}
2010-03-22 22:46:34 +00:00
childScope.scope.set(valueIdent, value);
if (keyIdent) childScope.scope.set(keyIdent, key);
2010-03-22 20:58:04 +00:00
childScope.scope.updateView();
lastElement = childScope.element;
index ++;
2010-03-16 17:30:26 +00:00
});
2010-03-22 20:58:04 +00:00
// shrink children
while(children.length > index) {
children.pop().element.remove();
}
2010-03-16 17:30:26 +00:00
});
};
2010-03-22 20:58:04 +00:00
}, {exclusive: true});
angularDirective("ng-action", function(expression, element){
return function(){
var self = this;
element.click(function(){
self.$eval(expression);
});
};
});
2010-03-22 23:07:42 +00:00
angularDirective("ng-watch", function(expression, element){
var match = expression.match(/^([^.]*):(.*)$/);
if (!match) {
throw "Expecting watch expression 'ident_to_watch: watch_statement' got '"
+ expression + "'";
}
return function(){
this.$watch(match[1], match[2]);
};
});
2010-03-23 04:29:57 +00:00
function ngClass(selector) {
return function(expression, element){
var existing = element[0].className + ' ';
return function(element){
this.$addEval(expression, function(value){
if (selector(this.$index)) {
if (isArray(value)) value = value.join(' ');
element[0].className = (existing + value).replace(/\s\s+/g, ' ');
}
});
};
};
}
angularDirective("ng-class", ngClass(function(){return true;}));
angularDirective("ng-class-odd", ngClass(function(i){return i % 2 == 1;}));
angularDirective("ng-class-even", ngClass(function(i){return i % 2 == 0;}));
2010-03-22 20:58:04 +00:00
2010-03-23 04:29:57 +00:00
angularDirective("ng-show", function(expression, element){
return function(element){
this.$addEval(expression, function(value){
element.css('display', toBoolean(value) ? '' : 'none');
});
};
});
angularDirective("ng-hide", function(expression, element){
return function(element){
this.$addEval(expression, function(value){
element.css('display', toBoolean(value) ? 'none' : '');
});
};
});
2010-03-22 20:58:04 +00:00
/////////////////////////////////////////
/////////////////////////////////////////
/////////////////////////////////////////
/////////////////////////////////////////
/////////////////////////////////////////
2010-03-16 17:30:26 +00:00
//widget related
//ng-validate, ng-required, ng-formatter
//ng-error
2010-03-16 20:50:47 +00:00
//ng-scope ng-controller????