aboutsummaryrefslogtreecommitdiffstats
path: root/src/directives.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/directives.js')
-rw-r--r--src/directives.js111
1 files changed, 62 insertions, 49 deletions
diff --git a/src/directives.js b/src/directives.js
index cabf0c23..ffe37890 100644
--- a/src/directives.js
+++ b/src/directives.js
@@ -1,10 +1,10 @@
-angularDirective("ng-init", function(expression){
+angularDirective("ng:init", function(expression){
return function(element){
this.$tryEval(expression, element);
};
});
-angularDirective("ng-controller", function(expression){
+angularDirective("ng:controller", function(expression){
return function(element){
var controller = getter(window, expression, true) || getter(this, expression, true);
if (!controller)
@@ -16,22 +16,23 @@ angularDirective("ng-controller", function(expression){
};
});
-angularDirective("ng-eval", function(expression){
+angularDirective("ng:eval", function(expression){
return function(element){
this.$onEval(expression, element);
};
});
-angularDirective("ng-bind", function(expression){
+angularDirective("ng:bind", function(expression){
return function(element) {
var lastValue = noop, lastError = noop;
this.$onEval(function() {
- var error,
- value = this.$tryEval(expression, function(e){
- error = toJson(e);
- }),
- isHtml,
- isDomElement;
+ var error, value, isHtml, isDomElement,
+ oldElement = this.hasOwnProperty('$element') ? this.$element : undefined;
+ this.$element = element;
+ value = this.$tryEval(expression, function(e){
+ error = toJson(e);
+ });
+ this.$element = oldElement;
if (lastValue === value && lastError == error) return;
isHtml = value instanceof HTML,
isDomElement = isElement(value);
@@ -74,7 +75,9 @@ function compileBindTemplate(template){
});
});
bindTemplateCache[template] = fn = function(element){
- var parts = [], self = this;
+ var parts = [], self = this,
+ oldElement = this.hasOwnProperty('$element') ? self.$element : undefined;
+ self.$element = element;
for ( var i = 0; i < bindings.length; i++) {
var value = bindings[i].call(self, element);
if (isElement(value))
@@ -83,13 +86,14 @@ function compileBindTemplate(template){
value = toJson(value, true);
parts.push(value);
};
+ self.$element = oldElement;
return parts.join('');
};
}
return fn;
}
-angularDirective("ng-bind-template", function(expression){
+angularDirective("ng:bind-template", function(expression){
var templateFn = compileBindTemplate(expression);
return function(element) {
var lastValue;
@@ -108,7 +112,7 @@ var REMOVE_ATTRIBUTES = {
'readonly':'readOnly',
'checked':'checked'
};
-angularDirective("ng-bind-attr", function(expression){
+angularDirective("ng:bind-attr", function(expression){
return function(element){
var lastValue = {};
this.$onEval(function(){
@@ -134,17 +138,17 @@ angularDirective("ng-bind-attr", function(expression){
};
});
-angularWidget("@ng-non-bindable", noop);
+angularWidget("@ng:non-bindable", noop);
-angularWidget("@ng-repeat", function(expression, element){
- element.removeAttr('ng-repeat');
- element.replaceWith(this.comment("ng-repeat: " + expression));
+angularWidget("@ng:repeat", function(expression, element){
+ element.removeAttr('ng:repeat');
+ element.replaceWith(this.comment("ng:repeat: " + expression));
var template = this.compile(element);
return function(reference){
var 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 '" +
+ throw "Expected ng:repeat in form of 'item in collection' but got '" +
expression + "'.";
}
lhs = match[1];
@@ -157,32 +161,32 @@ angularWidget("@ng-repeat", function(expression, element){
valueIdent = match[3] || match[1];
keyIdent = match[2];
- if (isUndefined(this.$eval(rhs))) this.$set(rhs, []);
-
var children = [], currentScope = this;
this.$onEval(function(){
var index = 0, childCount = children.length, childScope, lastElement = reference,
- collection = this.$tryEval(rhs, reference);
+ collection = this.$tryEval(rhs, reference), is_array = isArray(collection);
for ( var key in collection) {
- if (index < childCount) {
- // reuse existing child
- childScope = children[index];
- childScope[valueIdent] = collection[key];
- if (keyIdent) childScope[keyIdent] = key;
- } else {
- // grow children
- childScope = template(element.clone(), createScope(currentScope));
- childScope[valueIdent] = collection[key];
- if (keyIdent) childScope[keyIdent] = key;
- lastElement.after(childScope.$element);
- childScope.$index = index;
- childScope.$element.attr('ng-repeat-index', index);
- childScope.$init();
- children.push(childScope);
+ if (!is_array || collection.hasOwnProperty(key)) {
+ if (index < childCount) {
+ // reuse existing child
+ childScope = children[index];
+ childScope[valueIdent] = collection[key];
+ if (keyIdent) childScope[keyIdent] = key;
+ } else {
+ // grow children
+ childScope = template(element.clone(), createScope(currentScope));
+ childScope[valueIdent] = collection[key];
+ if (keyIdent) childScope[keyIdent] = key;
+ lastElement.after(childScope.$element);
+ childScope.$index = index;
+ childScope.$element.attr('ng:repeat-index', index);
+ childScope.$init();
+ children.push(childScope);
+ }
+ childScope.$eval();
+ lastElement = childScope.$element;
+ index ++;
}
- childScope.$eval();
- lastElement = childScope.$element;
- index ++;
};
// shrink children
while(children.length > index) {
@@ -192,7 +196,7 @@ angularWidget("@ng-repeat", function(expression, element){
};
});
-angularDirective("ng-click", function(expression, element){
+angularDirective("ng:click", function(expression, element){
return function(element){
var self = this;
element.bind('click', function(){
@@ -203,7 +207,7 @@ angularDirective("ng-click", function(expression, element){
};
});
-angularDirective("ng-watch", function(expression, element){
+angularDirective("ng:watch", function(expression, element){
return function(element){
var self = this;
new Parser(expression).watch()({
@@ -221,8 +225,8 @@ function ngClass(selector) {
var existing = element[0].className + ' ';
return function(element){
this.$onEval(function(){
- var value = this.$eval(expression);
if (selector(this.$index)) {
+ var value = this.$eval(expression);
if (isArray(value)) value = value.join(' ');
element[0].className = trim(existing + value);
}
@@ -231,11 +235,11 @@ function ngClass(selector) {
};
}
-angularDirective("ng-class", ngClass(function(){return true;}));
-angularDirective("ng-class-odd", ngClass(function(i){return i % 2 === 0;}));
-angularDirective("ng-class-even", ngClass(function(i){return i % 2 === 1;}));
+angularDirective("ng:class", ngClass(function(){return true;}));
+angularDirective("ng:class-odd", ngClass(function(i){return i % 2 === 0;}));
+angularDirective("ng:class-even", ngClass(function(i){return i % 2 === 1;}));
-angularDirective("ng-show", function(expression, element){
+angularDirective("ng:show", function(expression, element){
return function(element){
this.$onEval(function(){
element.css('display', toBoolean(this.$eval(expression)) ? '' : 'none');
@@ -243,7 +247,7 @@ angularDirective("ng-show", function(expression, element){
};
});
-angularDirective("ng-hide", function(expression, element){
+angularDirective("ng:hide", function(expression, element){
return function(element){
this.$onEval(function(){
element.css('display', toBoolean(this.$eval(expression)) ? 'none' : '');
@@ -251,10 +255,19 @@ angularDirective("ng-hide", function(expression, element){
};
});
-angularDirective("ng-style", function(expression, element){
+angularDirective("ng:style", function(expression, element){
return function(element){
+ var resetStyle = getStyle(element);
this.$onEval(function(){
- element.css(this.$eval(expression));
+ var style = this.$eval(expression) || {}, key, mergedStyle = {};
+ for(key in style) {
+ if (resetStyle[key] === undefined) resetStyle[key] = '';
+ mergedStyle[key] = style[key];
+ }
+ for(key in resetStyle) {
+ mergedStyle[key] = mergedStyle[key] || resetStyle[key];
+ }
+ element.css(mergedStyle);
}, element);
};
});