aboutsummaryrefslogtreecommitdiffstats
path: root/src/widget
diff options
context:
space:
mode:
Diffstat (limited to 'src/widget')
-rw-r--r--src/widget/form.js4
-rw-r--r--src/widget/input.js89
-rw-r--r--src/widget/select.js38
3 files changed, 60 insertions, 71 deletions
diff --git a/src/widget/form.js b/src/widget/form.js
index 49e3a545..f3134db4 100644
--- a/src/widget/form.js
+++ b/src/widget/form.js
@@ -52,8 +52,8 @@
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.text = 'guest';
+ function Ctrl($scope) {
+ $scope.text = 'guest';
}
</script>
<div ng:controller="Ctrl">
diff --git a/src/widget/input.js b/src/widget/input.js
index a744e567..5db52704 100644
--- a/src/widget/input.js
+++ b/src/widget/input.js
@@ -31,9 +31,9 @@ var INTEGER_REGEXP = /^\s*(\-|\+)?\d+\s*$/;
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.text = 'guest';
- this.word = /^\w*$/;
+ function Ctrl($scope) {
+ $scope.text = 'guest';
+ $scope.word = /^\w*$/;
}
</script>
<div ng:controller="Ctrl">
@@ -96,8 +96,8 @@ var INTEGER_REGEXP = /^\s*(\-|\+)?\d+\s*$/;
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.text = 'me@example.com';
+ function Ctrl($scope) {
+ $scope.text = 'me@example.com';
}
</script>
<div ng:controller="Ctrl">
@@ -136,9 +136,8 @@ var INTEGER_REGEXP = /^\s*(\-|\+)?\d+\s*$/;
</doc:scenario>
</doc:example>
*/
-angularInputType('email', function() {
- var widget = this;
- this.$on('$validate', function(event){
+angularInputType('email', function(element, widget) {
+ widget.$on('$validate', function(event) {
var value = widget.$viewValue;
widget.$emit(!value || value.match(EMAIL_REGEXP) ? "$valid" : "$invalid", "EMAIL");
});
@@ -170,8 +169,8 @@ angularInputType('email', function() {
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.text = 'http://google.com';
+ function Ctrl($scope) {
+ $scope.text = 'http://google.com';
}
</script>
<div ng:controller="Ctrl">
@@ -210,9 +209,8 @@ angularInputType('email', function() {
</doc:scenario>
</doc:example>
*/
-angularInputType('url', function() {
- var widget = this;
- this.$on('$validate', function(event){
+angularInputType('url', function(element, widget) {
+ widget.$on('$validate', function(event) {
var value = widget.$viewValue;
widget.$emit(!value || value.match(URL_REGEXP) ? "$valid" : "$invalid", "URL");
});
@@ -239,8 +237,8 @@ angularInputType('url', function() {
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.names = ['igor', 'misko', 'vojta'];
+ function Ctrl($scope) {
+ $scope.names = ['igor', 'misko', 'vojta'];
}
</script>
<div ng:controller="Ctrl">
@@ -270,7 +268,7 @@ angularInputType('url', function() {
</doc:scenario>
</doc:example>
*/
-angularInputType('list', function() {
+angularInputType('list', function(element, widget) {
function parse(viewValue) {
var list = [];
forEach(viewValue.split(/\s*,\s*/), function(value){
@@ -278,14 +276,14 @@ angularInputType('list', function() {
});
return list;
}
- this.$parseView = function() {
- isString(this.$viewValue) && (this.$modelValue = parse(this.$viewValue));
+ widget.$parseView = function() {
+ isString(widget.$viewValue) && (widget.$modelValue = parse(widget.$viewValue));
};
- this.$parseModel = function() {
- var modelValue = this.$modelValue;
+ widget.$parseModel = function() {
+ var modelValue = widget.$modelValue;
if (isArray(modelValue)
- && (!isString(this.$viewValue) || !equals(parse(this.$viewValue), modelValue))) {
- this.$viewValue = modelValue.join(', ');
+ && (!isString(widget.$viewValue) || !equals(parse(widget.$viewValue), modelValue))) {
+ widget.$viewValue = modelValue.join(', ');
}
};
});
@@ -318,8 +316,8 @@ angularInputType('list', function() {
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.value = 12;
+ function Ctrl($scope) {
+ $scope.value = 12;
}
</script>
<div ng:controller="Ctrl">
@@ -388,8 +386,8 @@ angularInputType('number', numericRegexpInputType(NUMBER_REGEXP, 'NUMBER'));
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.value = 12;
+ function Ctrl($scope) {
+ $scope.value = 12;
}
</script>
<div ng:controller="Ctrl">
@@ -449,9 +447,9 @@ angularInputType('integer', numericRegexpInputType(INTEGER_REGEXP, 'INTEGER'));
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.value1 = true;
- this.value2 = 'YES'
+ function Ctrl($scope) {
+ $scope.value1 = true;
+ $scope.value2 = 'YES'
}
</script>
<div ng:controller="Ctrl">
@@ -477,9 +475,8 @@ angularInputType('integer', numericRegexpInputType(INTEGER_REGEXP, 'INTEGER'));
</doc:scenario>
</doc:example>
*/
-angularInputType('checkbox', function(inputElement) {
- var widget = this,
- trueValue = inputElement.attr('ng:true-value'),
+angularInputType('checkbox', function(inputElement, widget) {
+ var trueValue = inputElement.attr('ng:true-value'),
falseValue = inputElement.attr('ng:false-value');
if (!isString(trueValue)) trueValue = true;
@@ -496,7 +493,7 @@ angularInputType('checkbox', function(inputElement) {
};
widget.$parseModel = function() {
- widget.$viewValue = this.$modelValue === trueValue;
+ widget.$viewValue = widget.$modelValue === trueValue;
};
widget.$parseView = function() {
@@ -522,8 +519,8 @@ angularInputType('checkbox', function(inputElement) {
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.color = 'blue';
+ function Ctrl($scope) {
+ $scope.color = 'blue';
}
</script>
<div ng:controller="Ctrl">
@@ -545,9 +542,7 @@ angularInputType('checkbox', function(inputElement) {
</doc:scenario>
</doc:example>
*/
-angularInputType('radio', function(inputElement) {
- var widget = this;
-
+angularInputType('radio', function(inputElement, widget) {
//correct the name
inputElement.attr('name', widget.$id + '@' + inputElement.attr('name'));
inputElement.bind('click', function() {
@@ -569,9 +564,8 @@ angularInputType('radio', function(inputElement) {
function numericRegexpInputType(regexp, error) {
- return ['$element', function(inputElement) {
- var widget = this,
- min = 1 * (inputElement.attr('min') || Number.MIN_VALUE),
+ return function(inputElement, widget) {
+ var min = 1 * (inputElement.attr('min') || Number.MIN_VALUE),
max = 1 * (inputElement.attr('max') || Number.MAX_VALUE);
widget.$on('$validate', function(event){
@@ -598,7 +592,7 @@ function numericRegexpInputType(regexp, error) {
? '' + widget.$modelValue
: '';
};
- }];
+ };
}
@@ -640,8 +634,8 @@ var HTML5_INPUTS_TYPES = makeMap(
<doc:example>
<doc:source>
<script>
- function Ctrl() {
- this.user = {name: 'guest', last: 'visitor'};
+ function Ctrl($scope) {
+ $scope.user = {name: 'guest', last: 'visitor'};
}
</script>
<div ng:controller="Ctrl">
@@ -713,7 +707,8 @@ angularWidget('input', function(inputElement){
this.descend(true);
var modelExp = inputElement.attr('ng:model');
return modelExp &&
- ['$defer', '$formFactory', '$element', function($defer, $formFactory, inputElement){
+ ['$defer', '$formFactory', '$element',
+ function($defer, $formFactory, inputElement) {
var form = $formFactory.forElement(inputElement),
// We have to use .getAttribute, since jQuery tries to be smart and use the
// type property. Trouble is some browser change unknown to text.
@@ -762,7 +757,7 @@ angularWidget('input', function(inputElement){
}
//TODO(misko): setting $inject is a hack
- !TypeController.$inject && (TypeController.$inject = ['$element']);
+ !TypeController.$inject && (TypeController.$inject = ['$element', '$scope']);
widget = form.$createWidget({
scope: modelScope,
model: modelExp,
@@ -866,7 +861,7 @@ angularWidget('textarea', angularWidget('input'));
function watchElementProperty(modelScope, widget, name, element) {
var bindAttr = fromJson(element.attr('ng:bind-attr') || '{}'),
- match = /\s*{{(.*)}}\s*/.exec(bindAttr[name]),
+ match = /\s*\{\{(.*)\}\}\s*/.exec(bindAttr[name]),
isBoolean = BOOLEAN_ATTR[name];
widget['$' + name] = isBoolean
? ( // some browsers return true some '' when required is set without value.
diff --git a/src/widget/select.js b/src/widget/select.js
index d4be91d9..b0f5eac5 100644
--- a/src/widget/select.js
+++ b/src/widget/select.js
@@ -65,15 +65,15 @@
<doc:example>
<doc:source>
<script>
- function MyCntrl() {
- this.colors = [
+ function MyCntrl($scope) {
+ $scope.colors = [
{name:'black', shade:'dark'},
{name:'white', shade:'light'},
{name:'red', shade:'dark'},
{name:'blue', shade:'dark'},
{name:'yellow', shade:'light'}
];
- this.color = this.colors[2]; // red
+ $scope.color = $scope.colors[2]; // red
}
</script>
<div ng:controller="MyCntrl">
@@ -140,11 +140,11 @@ angularWidget('select', function(element){
optionsExp = selectElement.attr('ng:options'),
modelExp = selectElement.attr('ng:model'),
widget = form.$createWidget({
- scope: this,
+ scope: modelScope,
model: modelExp,
onChange: selectElement.attr('ng:change'),
alias: selectElement.attr('name'),
- controller: optionsExp ? Options : (multiple ? Multiple : Single)});
+ controller: ['$scope', optionsExp ? Options : (multiple ? Multiple : Single)]});
selectElement.bind('$destroy', function() { widget.$destroy(); });
@@ -174,11 +174,9 @@ angularWidget('select', function(element){
////////////////////////////
- function Multiple() {
- var widget = this;
-
- this.$render = function() {
- var items = new HashMap(this.$viewValue);
+ function Multiple(widget) {
+ widget.$render = function() {
+ var items = new HashMap(widget.$viewValue);
forEach(selectElement.children(), function(option){
option.selected = isDefined(items.get(option.value));
});
@@ -198,9 +196,7 @@ angularWidget('select', function(element){
}
- function Single() {
- var widget = this;
-
+ function Single(widget) {
widget.$render = function() {
selectElement.val(widget.$viewValue);
};
@@ -214,9 +210,8 @@ angularWidget('select', function(element){
widget.$viewValue = selectElement.val();
}
- function Options() {
- var widget = this,
- match;
+ function Options(widget) {
+ var match;
if (! (match = optionsExp.match(NG_OPTIONS_REGEXP))) {
throw Error(
@@ -224,8 +219,7 @@ angularWidget('select', function(element){
" but got '" + optionsExp + "'.");
}
- var widgetScope = this,
- displayFn = $parse(match[2] || match[1]),
+ var displayFn = $parse(match[2] || match[1]),
valueName = match[4] || match[6],
keyName = match[5],
groupByFn = $parse(match[3] || ''),
@@ -253,7 +247,7 @@ angularWidget('select', function(element){
selectElement.html(''); // clear contents
selectElement.bind('change', function() {
- widgetScope.$apply(function() {
+ widget.$apply(function() {
var optionGroup,
collection = valuesFn(modelScope) || [],
key = selectElement.val(),
@@ -288,13 +282,13 @@ angularWidget('select', function(element){
}
}
if (isDefined(value) && modelScope.$viewVal !== value) {
- widgetScope.$emit('$viewChange', value);
+ widget.$emit('$viewChange', value);
}
});
});
- widgetScope.$watch(render);
- widgetScope.$render = render;
+ widget.$watch(render);
+ widget.$render = render;
function render() {
var optionGroups = {'':[]}, // Temporary location for the option groups before we render them