Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(5)

Unified Diff: third_party/pkg/angular/lib/directive/ng_model.dart

Issue 256553002: Revert "Update all Angular libs (run update_all.sh)." (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/pkg/angular/lib/directive/ng_model.dart
diff --git a/third_party/pkg/angular/lib/directive/ng_model.dart b/third_party/pkg/angular/lib/directive/ng_model.dart
index b71273c31e0b889d7c28c46416709ff034126637..712bc7783abc897ba2a380adc5aa0eb03abc9e29 100644
--- a/third_party/pkg/angular/lib/directive/ng_model.dart
+++ b/third_party/pkg/angular/lib/directive/ng_model.dart
@@ -1,22 +1,6 @@
part of angular.directive;
/**
- * NgModelConverter is the class interface for performing transformations on
- * the viewValue and modelValue properties on a model. A new converter can be created
- * by implementing the NgModelConverter class and then attaching to a model via the
- * provided setter.
- */
-abstract class NgModelConverter {
- String get name;
- parse(value) => value;
- format(value) => value;
-}
-
-class _NoopModelConverter extends NgModelConverter {
- final name = 'ng-noop';
-}
-
-/**
* Ng-model directive is responsible for reading/writing to the model.
* The directive itself is headless. (It does not know how to render or what
* events to listen for.) It is meant to be used with other directives which
@@ -26,291 +10,155 @@ class _NoopModelConverter extends NgModelConverter {
* knows how to (in)validate the model and the form in which it is declared
* (to be implemented)
*/
-@Decorator(selector: '[ng-model]')
-class NgModel extends NgControl implements AttachAware {
- final Scope _scope;
+@NgDirective(selector: '[ng-model]')
+class NgModel extends NgControl implements NgAttachAware {
+ final NgForm _form;
+ final AstParser _parser;
+ BoundGetter getter = ([_]) => null;
BoundSetter setter = (_, [__]) => null;
- String _expression;
- var _originalValue, _viewValue, _modelValue;
- bool _alwaysProcessViewValue;
- bool _toBeValidated = false;
- Function render = (value) => null;
+ var _lastValue;
+ String _exp;
+ final _validators = <NgValidatable>[];
- final _validators = <NgValidator>[];
- NgModelConverter _converter;
- Watch _watch;
+ Watch _removeWatch;
bool _watchCollection;
+ Function render = (value) => null;
- NgModel(this._scope, NgElement element, Injector injector, NodeAttrs attrs,
- Animate animate)
- : super(element, injector, animate)
+ NgModel(Scope _scope, dom.Element _element, Injector injector,
+ NgForm this._form, this._parser, NodeAttrs attrs)
+ : super(_scope, _element, injector)
{
- _expression = attrs["ng-model"];
+ _exp = attrs["ng-model"];
watchCollection = false;
-
- //Since the user will never be editing the value of a select element then
- //there is no reason to guard the formatter from changing the DOM value.
- _alwaysProcessViewValue = element.node.tagName == 'SELECT';
- converter = new _NoopModelConverter();
- markAsUntouched();
- markAsPristine();
}
- void _processViewValue(value) {
+ process(value, [_]) {
validate();
- _viewValue = converter.format(value);
- _scope.rootScope.domWrite(() => render(_viewValue));
+ _scope.rootScope.domWrite(() => render(value));
}
- void attach() {
+ attach() {
watchCollection = false;
+ _scope.on('resetNgModel').listen((e) => reset());
}
- /**
- * Resets the model value to it's original (pristine) value. If the model has been interacted
- * with by the user at all then the model will be also reset to an "untouched" state.
- */
- void reset() {
- markAsUntouched();
- _processViewValue(_originalValue);
- modelValue = _originalValue;
- }
-
- void onSubmit(bool valid) {
- super.onSubmit(valid);
- if (valid) _originalValue = modelValue;
- }
-
- void markAsUntouched() {
- removeInfoState(this, NgControl.NG_TOUCHED);
- }
-
- void markAsTouched() {
- addInfoState(this, NgControl.NG_TOUCHED);
- }
-
- void markAsPristine() {
- removeInfoState(this, NgControl.NG_DIRTY);
- }
-
- void markAsDirty() {
- addInfoState(this, NgControl.NG_DIRTY);
- }
-
- /**
- * Flags the model to be set for validation upon the next digest. This operation is useful
- * to optimize validations incase multiple validations are triggered one after the other.
- */
- void validateLater() {
- if (_toBeValidated) return;
- _toBeValidated = true;
- _scope.rootScope.runAsync(() {
- if (_toBeValidated) {
- validate();
- }
- });
- }
-
- /**
- * Returns the associated converter that is used with the model.
- */
- NgModelConverter get converter => _converter;
- set converter(NgModelConverter c) {
- _converter = c;
- _processViewValue(modelValue);
+ reset() {
+ untouched = true;
+ modelValue = _lastValue;
}
@NgAttr('name')
- String get name => _name;
- void set name(value) {
+ get name => _name;
+ set name(value) {
_name = value;
_parentControl.addControl(this);
}
// TODO(misko): could we get rid of watch collection, and just always watch the collection?
- bool get watchCollection => _watchCollection;
- void set watchCollection(value) {
+ get watchCollection => _watchCollection;
+ set watchCollection(value) {
if (_watchCollection == value) return;
-
- var onChange = (value, [_]) {
- if (_alwaysProcessViewValue || _modelValue != value) {
- _modelValue = value;
- _processViewValue(value);
- }
- };
-
_watchCollection = value;
- if (_watch!=null) _watch.remove();
+ if (_removeWatch!=null) _removeWatch.remove();
if (_watchCollection) {
- _watch = _scope.watch(_expression, (changeRecord, _) {
- onChange(changeRecord is CollectionChangeRecord
- ? changeRecord.iterable
- : changeRecord);
- },
- collection: true);
- } else if (_expression != null) {
- _watch = _scope.watch(_expression, onChange);
+ _removeWatch = _scope.watch(
+ _parser(_exp, collection: true),
+ (changeRecord, _) {
+ var value = changeRecord is CollectionChangeRecord ? changeRecord.iterable: changeRecord;
+ process(value);
+ });
+ } else if (_exp != null) {
+ _removeWatch = _scope.watch(_exp, process);
}
}
// TODO(misko): getters/setters need to go. We need AST here.
@NgCallback('ng-model')
- void set model(BoundExpression boundExpression) {
+ set model(BoundExpression boundExpression) {
+ getter = boundExpression;
setter = boundExpression.assign;
+
_scope.rootScope.runAsync(() {
- _modelValue = boundExpression();
- _originalValue = modelValue;
- _processViewValue(_modelValue);
+ _lastValue = modelValue;
});
}
- /**
- * Applies the given [error] to the model.
- */
- void addError(String error) {
- this.addErrorState(this, error);
- }
-
- /**
- * Removes the given [error] from the model.
- */
- void removeError(String error) {
- this.removeErrorState(this, error);
- }
-
- /**
- * Adds the given [info] state to the model.
- */
- void addInfo(String info) {
- this.addInfoState(this, info);
- }
-
- /**
- * Removes the given [info] state from the model.
- */
- void removeInfo(String info) {
- this.removeInfoState(this, info);
- }
-
- get viewValue => _viewValue;
- void set viewValue(value) {
- _viewValue = value;
- modelValue = value;
- }
+ // TODO(misko): right now viewValue and modelValue are the same,
+ // but this needs to be changed to support converters and form validation
+ get viewValue => modelValue;
+ set viewValue(value) => modelValue = value;
- get modelValue => _modelValue;
- void set modelValue(value) {
- try {
- value = converter.parse(value);
- } catch(e) {
- value = null;
- }
- _modelValue = value;
- setter(value);
+ get modelValue => getter();
+ set modelValue(value) => setter(value);
- if (modelValue == _originalValue) {
- markAsPristine();
- } else {
- markAsDirty();
- }
- }
-
- /**
- * Returns the list of validators that are registered on the model.
- */
- List<NgValidator> get validators => _validators;
+ get validators => _validators;
/**
- * Executes a validation on the model against each of the validators present on the model.
- * Once complete, the model will either be set as valid or invalid.
+ * Executes a validation on the form against each of the validation present on the model.
*/
- void validate() {
- _toBeValidated = false;
+ validate() {
if (validators.isNotEmpty) {
validators.forEach((validator) {
- if (validator.isValid(modelValue)) {
- removeError(validator.name);
- } else {
- addError(validator.name);
- }
+ setValidity(validator.name, validator.isValid(viewValue));
});
- }
-
- if (invalid) {
- addInfo(NgControl.NG_INVALID);
} else {
- removeInfo(NgControl.NG_INVALID);
+ valid = true;
}
}
+ setValidity(String name, bool valid) {
+ this.updateControlValidity(this, name, valid);
+ }
+
/**
* Registers a validator into the model to consider when running validate().
*/
- void addValidator(NgValidator v) {
+ addValidator(NgValidatable v) {
validators.add(v);
- validateLater();
+ validate();
}
/**
* De-registers a validator from the model.
*/
- void removeValidator(NgValidator v) {
+ removeValidator(NgValidatable v) {
validators.remove(v);
- validateLater();
+ validate();
}
}
/**
* Usage:
*
- * <input type="checkbox"
- * ng-model="expr"
- * [ng-true-value="t_expr"]
- * [ng-false-value="f_expr"]
- * >
- *
- * This creates a two way databinding between the `ng-model` expression
- * and the checkbox input element state.
- *
- * If the optional `ng-true-value` is absent then: if the model expression
- * evaluates to true or to a nonzero [:num:], then the checkbox is checked;
- * otherwise, it is unchecked.
- *
- * If `ng-true-value="t_expr"` is present, then: if the model expression
- * evaluates to the same value as `t_expr` then the checkbox is checked;
- * otherwise, it is unchecked.
- *
- * When the checkbox is checked, the model is set to the value of `t_expr` if
- * present, true otherwise. When unchecked, it is set to the value of
- * `f_expr` if present, false otherwise.
+ * <input type="checkbox" ng-model="flag">
*
- * Also see [NgTrueValue] and [NgFalseValue].
+ * This creates a two way databinding between the boolean expression specified
+ * in ng-model and the checkbox input element in the DOM.  If the ng-model value
+ * is falsy (i.e. one of `false`, `null`, and `0`), then the checkbox is
+ * unchecked. Otherwise, it is checked.  Likewise, when the checkbox is checked,
+ * the model value is set to true. When unchecked, it is set to false.
*/
-@Decorator(selector: 'input[type=checkbox][ng-model]')
-class InputCheckbox {
- final dom.CheckboxInputElement inputElement;
+@NgDirective(selector: 'input[type=checkbox][ng-model]')
+class InputCheckboxDirective {
+ final dom.InputElement inputElement;
final NgModel ngModel;
final NgTrueValue ngTrueValue;
final NgFalseValue ngFalseValue;
final Scope scope;
- InputCheckbox(dom.Element this.inputElement, this.ngModel,
- this.scope, this.ngTrueValue, this.ngFalseValue) {
+ InputCheckboxDirective(dom.Element this.inputElement, this.ngModel,
+ this.scope, this.ngTrueValue, this.ngFalseValue) {
ngModel.render = (value) {
- scope.rootScope.domWrite(() {
- inputElement.checked = ngTrueValue.isValue(value);
- });
+ inputElement.checked = ngTrueValue.isValue(inputElement, value);
};
- inputElement
- ..onChange.listen((_) {
- ngModel.viewValue = inputElement.checked
- ? ngTrueValue.value : ngFalseValue.value;
- })
- ..onBlur.listen((e) {
- ngModel.markAsTouched();
- });
+ inputElement.onChange.listen((value) {
+ ngModel.dirty = true;
+ ngModel.viewValue = inputElement.checked
+ ? ngTrueValue.readValue(inputElement)
+ : ngFalseValue.readValue(inputElement);
+ });
}
}
@@ -321,52 +169,55 @@ class InputCheckbox {
* <textarea ng-model="myModel"></textarea>
*
* This creates a two-way binding between any string-based input element
- * (both `<input>` and `<textarea>`) so long as the ng-model attribute is
+ * (both <input> and <textarea>) so long as the ng-model attribute is
* present on the input element. Whenever the value of the input element
* changes then the matching model property on the scope will be updated
* as well as the other way around (when the scope property is updated).
*
*/
-@Decorator(selector: 'textarea[ng-model]')
-@Decorator(selector: 'input[type=text][ng-model]')
-@Decorator(selector: 'input[type=password][ng-model]')
-@Decorator(selector: 'input[type=url][ng-model]')
-@Decorator(selector: 'input[type=email][ng-model]')
-@Decorator(selector: 'input[type=search][ng-model]')
-class InputTextLike {
+@NgDirective(selector: 'textarea[ng-model]')
+@NgDirective(selector: 'input[type=text][ng-model]')
+@NgDirective(selector: 'input[type=password][ng-model]')
+@NgDirective(selector: 'input[type=url][ng-model]')
+@NgDirective(selector: 'input[type=email][ng-model]')
+@NgDirective(selector: 'input[type=search][ng-model]')
+class InputTextLikeDirective {
final dom.Element inputElement;
final NgModel ngModel;
final Scope scope;
String _inputType;
get typedValue => (inputElement as dynamic).value;
- void set typedValue(value) {
- (inputElement as dynamic).value = (value == null) ? '' : value.toString();
- }
+ set typedValue(value) => (inputElement as dynamic).value = (value == null) ?
+ '' :
+ value.toString();
- InputTextLike(this.inputElement, this.ngModel, this.scope) {
+ InputTextLikeDirective(this.inputElement, this.ngModel, this.scope) {
ngModel.render = (value) {
- scope.rootScope.domWrite(() {
- if (value == null) value = '';
-
- var currentValue = typedValue;
- if (value != currentValue && !(value is num && currentValue is num &&
- value.isNaN && currentValue.isNaN)) {
- typedValue = value;
- }
- });
+ if (value == null) value = '';
+
+ var currentValue = typedValue;
+ if (value != currentValue && !(value is num && currentValue is num &&
+ value.isNaN && currentValue.isNaN)) {
+ typedValue = value;
+ }
};
inputElement
..onChange.listen(processValue)
..onInput.listen(processValue)
..onBlur.listen((e) {
- ngModel.markAsTouched();
+ if (ngModel.touched == null || ngModel.touched == false) {
+ ngModel.touched = true;
+ }
});
}
- void processValue([_]) {
+ processValue([_]) {
var value = typedValue;
- if (value != ngModel.viewValue) ngModel.viewValue = value;
+ if (value != ngModel.viewValue) {
+ ngModel.dirty = true;
+ ngModel.viewValue = value;
+ }
ngModel.validate();
}
}
@@ -382,23 +233,20 @@ class InputTextLike {
*
* This creates a two-way binding between the input and the named model property
* (e.g., myModel in the example above). When processing the input, its value is
- * read as a [:num:], via the [dom.InputElement.valueAsNumber] field. If the
- * input text does not represent a number, then the model is appropriately set
- * to [double.NAN]. Setting the model property to [null] will clear the input.
+ * read as a [num], via the [dom.InputElement.valueAsNumber] field. If the input
+ * text does not represent a number, then the model is appropriately set to
+ * [double.NAN]. Setting the model property to [null] will clear the input.
* Setting the model to [double.NAN] will have no effect (input will be left
* unchanged).
*/
-@Decorator(selector: 'input[type=number][ng-model]')
-@Decorator(selector: 'input[type=range][ng-model]')
-class InputNumberLike {
+@NgDirective(selector: 'input[type=number][ng-model]')
+@NgDirective(selector: 'input[type=range][ng-model]')
+class InputNumberLikeDirective {
final dom.InputElement inputElement;
final NgModel ngModel;
final Scope scope;
-
- // We can't use [inputElement.valueAsNumber] due to http://dartbug.com/15788
- num get typedValue => num.parse(inputElement.value, (v) => double.NAN);
-
+ num get typedValue => inputElement.valueAsNumber;
void set typedValue(num value) {
// [chalin, 2014-02-16] This post
// http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2010-January/024829.html
@@ -408,214 +256,26 @@ class InputNumberLike {
if (value == null) {
inputElement.value = null;
} else {
- // We can't use inputElement.valueAsNumber due to http://dartbug.com/15788
- inputElement.value = "$value";
+ inputElement.valueAsNumber = value;
}
}
- InputNumberLike(dom.Element this.inputElement, this.ngModel, this.scope) {
+ InputNumberLikeDirective(dom.Element this.inputElement, this.ngModel, this.scope) {
ngModel.render = (value) {
- scope.rootScope.domWrite(() {
- if (value != typedValue
- && (value == null || value is num && !value.isNaN)) {
- typedValue = value;
- }
- });
+ if (value != typedValue
+ && (value == null || value is num && !value.isNaN)) {
+ typedValue = value;
+ }
};
inputElement
..onChange.listen(relaxFnArgs(processValue))
- ..onInput.listen(relaxFnArgs(processValue))
- ..onBlur.listen((e) {
- ngModel.markAsTouched();
- });
+ ..onInput.listen(relaxFnArgs(processValue));
}
- void processValue() {
+ processValue() {
num value = typedValue;
if (value != ngModel.viewValue) {
- scope.eval(() => ngModel.viewValue = value);
- }
- ngModel.validate();
- }
-}
-
-/**
- * This directive affects which IDL attribute will be used to read the value of
- * date/time related input directives. Recognized values for this directive are:
- *
- * - [DATE]: [dom.InputElement].valueAsDate will be read.
- * - [NUMBER]: [dom.InputElement].valueAsNumber will be read.
- * - [STRING]: [dom.InputElement].value will be read.
- *
- * The default is [DATE]. Use other settings, e.g., when an app needs to support
- * browsers that treat date-like inputs as text (in such a case the [STRING]
- * kind would be appropriate) or, for browsers that fail to conform to the
- * HTML5 standard in their processing of date-like inputs.
- */
-@Decorator(selector: 'input[type=date][ng-model][ng-bind-type]')
-@Decorator(selector: 'input[type=time][ng-model][ng-bind-type]')
-@Decorator(selector: 'input[type=datetime][ng-model][ng-bind-type]')
-@Decorator(selector: 'input[type=datetime-local][ng-model][ng-bind-type]')
-@Decorator(selector: 'input[type=month][ng-model][ng-bind-type]')
-@Decorator(selector: 'input[type=week][ng-model][ng-bind-type]')
-class NgBindTypeForDateLike {
- static const DATE = 'date';
- static const NUMBER = 'number';
- static const STRING = 'string';
- static const DEFAULT = DATE;
- static const VALID_VALUES = const <String>[DATE, NUMBER, STRING];
-
- final dom.InputElement inputElement;
- String _idlAttrKind = DEFAULT;
-
- NgBindTypeForDateLike(dom.Element this.inputElement);
-
- @NgAttr('ng-bind-type')
- void set idlAttrKind(final String _kind) {
- String kind = _kind == null ? DEFAULT : _kind.toLowerCase();
- if (!VALID_VALUES.contains(kind))
- throw "Unsupported ng-bind-type attribute value '$_kind'; "
- "it should be one of $VALID_VALUES";
- _idlAttrKind = kind;
- }
-
- String get idlAttrKind => _idlAttrKind;
-
- dynamic get inputTypedValue {
- switch (idlAttrKind) {
- case DATE: return inputValueAsDate;
- case NUMBER: return inputElement.valueAsNumber;
- default: return inputElement.value;
- }
- }
-
- void set inputTypedValue(dynamic inputValue) {
- if (inputValue is DateTime) {
- inputValueAsDate = inputValue;
- } else if (inputValue is num) {
- inputElement.valueAsNumber = inputValue;
- } else {
- inputElement.value = inputValue;
- }
- }
-
- /// Input's `valueAsDate` normalized to UTC (per HTML5 std).
- DateTime get inputValueAsDate {
- DateTime dt;
- // Wrap in try-catch due to
- // https://code.google.com/p/dart/issues/detail?id=17625
- try {
- dt = inputElement.valueAsDate;
- } catch (e) {
- dt = null;
- }
- return (dt != null && !dt.isUtc) ? dt.toUtc() : dt;
- }
-
- /// Set input's `valueAsDate`. Argument is normalized to UTC if necessary
- /// (per HTML standard).
- void set inputValueAsDate(DateTime dt) {
- inputElement.valueAsDate = (dt != null && !dt.isUtc) ? dt.toUtc() : dt;
- }
-}
-
-/**
- * **Background: Standards and Browsers**
- *
- * According to the
- * [HTML5 Standard](http://www.w3.org/TR/html5/forms.html#the-input-element),
- * the [dom.InputElement.valueAsDate] and [dom.InputElement.valueAsNumber] IDL
- * attributes should be available for all date/time related input types,
- * except for `datetime-local` which is limited to
- * [dom.InputElement.valueNumber]. Of course, all input types support
- * [dom.InputElement.value] which yields a [String];
- * [dom.InputElement.valueAsDate] yields a [DateTime] and
- * [dom.InputElement.valueNumber] yields a [num].
- *
- * But not all browsers currently support date/time related inputs and of
- * those that do, some deviate from the standard. Hence, this directive
- * allows developers to control the IDL attribute that will be used
- * to read the value of a date/time input. This is achieved via the subordinate
- * 'ng-bind-type' directive; see [NgBindTypeForDateLike] for details.
- *
- * **Usage**:
- *
- * <input type="date|datetime|datetime-local|month|time|week"
- * [ng-bind-type="date"]
- * ng-model="myModel">
- *
- * **Model**:
- *
- * dynamic myModel; // one of DateTime | num | String
- *
- * This directive creates a two-way binding between the input and a model
- * property. The subordinate 'ng-bind-type' directive determines which input
- * IDL attribute is read (see [NgBindTypeForDateLike] for details) and
- * hence the type of the read values. The type of the model property value
- * determines which IDL attribute is written to: [DateTime] and [num] values
- * are assigned to [dom.InputElement.valueAsDate] and
- * [dom.InputElement.valueNumber], respectively; [String] and `null` values
- * are assigned to [dom.InputElement.value]. Setting the model to `null` will
- * clear the input if it is currently valid, otherwise, invalid input is left
- * untouched (so that the user has an opportunity to correct it). To clear the
- * input unconditionally, set the model property to the empty string ('').
- *
- * **Notes**:
- * - As prescribed by the HTML5 standard, [DateTime] values returned by the
- * `valueAsDate` IDL attribute are meant to be in UTC.
- * - As of the HTML5 Editor's Draft 29 March 2014, datetime-local is no longer
- * part of the standard. Other date related input are also at risk of being
- * dropped.
- */
-
-@Decorator(selector: 'input[type=date][ng-model]',
- module: InputDateLike.moduleFactory)
-@Decorator(selector: 'input[type=time][ng-model]',
- module: InputDateLike.moduleFactory)
-@Decorator(selector: 'input[type=datetime][ng-model]',
- module: InputDateLike.moduleFactory)
-@Decorator(selector: 'input[type=datetime-local][ng-model]',
- module: InputDateLike.moduleFactory)
-@Decorator(selector: 'input[type=month][ng-model]',
- module: InputDateLike.moduleFactory)
-@Decorator(selector: 'input[type=week][ng-model]',
- module: InputDateLike.moduleFactory)
-class InputDateLike {
- static Module moduleFactory() => new Module()..factory(NgBindTypeForDateLike,
- (Injector i) => new NgBindTypeForDateLike(i.get(dom.Element)));
- final dom.InputElement inputElement;
- final NgModel ngModel;
- final Scope scope;
- NgBindTypeForDateLike ngBindType;
-
- InputDateLike(dom.Element this.inputElement, this.ngModel, this.scope,
- this.ngBindType) {
- if (inputElement.type == 'datetime-local') {
- ngBindType.idlAttrKind = NgBindTypeForDateLike.NUMBER;
- }
- ngModel.render = (value) {
- scope.rootScope.domWrite(() {
- if (!eqOrNaN(value, typedValue)) typedValue = value;
- });
- };
- inputElement
- ..onChange.listen(relaxFnArgs(processValue))
- ..onInput.listen(relaxFnArgs(processValue))
- ..onBlur.listen((e) {
- ngModel.markAsTouched();
- });
- }
-
- dynamic get typedValue => ngBindType.inputTypedValue;
-
- void set typedValue(dynamic value) {
- ngBindType.inputTypedValue = value;
- }
-
- void processValue() {
- var value = typedValue;
- // print("processValue: value=$value, model=${ngModel.viewValue}");
- if (!eqOrNaN(value, ngModel.viewValue)) {
+ ngModel.dirty = true;
scope.eval(() => ngModel.viewValue = value);
}
ngModel.validate();
@@ -627,7 +287,7 @@ class _UidCounter {
static final int CHAR_9 = "9".codeUnitAt(0);
static final int CHAR_A = "A".codeUnitAt(0);
static final int CHAR_Z = "Z".codeUnitAt(0);
- final charCodes = [CHAR_0, CHAR_0, CHAR_0];
+ List charCodes = [CHAR_0, CHAR_0, CHAR_0];
String next() {
for (int i = charCodes.length - 1; i >= 0; i--) {
@@ -650,79 +310,64 @@ class _UidCounter {
final _uidCounter = new _UidCounter();
/**
- * Usage:
- *
- * <input type=radio ng-model=model [ng-value=expr]>
- *
- * <option [ng-value=expr]>...</option>
- *
- * Example:
- *
- * <select ng-model="robot">
- * <option ng-repeat="r in robots" ng-value="r">{{r.name}}</option>
- * </select>
- *
- * When present, the value of this `ng-value` one-way attribute is assigned to
- * the `ng-model` property when the corresponding radio element or option is
- * selected. Note that `expr` can be not any type; i.e., it is not restricted
- * to [String].
+ * Use `ng-value` directive with `<input type="radio">` or `<option>` to
+ * allow binding to values other then strings. This is needed since the
+ * `value` attribute on DOM element `<input type="radio" value="foo">` can
+ * only be a string. With `ng-value` one can bind to any object.
*/
-@Decorator(selector: 'input[type=radio][ng-model][ng-value]')
-@Decorator(selector: 'option[ng-value]')
+@NgDirective(selector: '[ng-value]')
class NgValue {
- static Module _module = new Module()..type(NgValue);
- static Module moduleFactory() => _module;
-
final dom.Element element;
- var _value;
+ @NgOneWay('ng-value')
+ var value;
NgValue(this.element);
- @NgOneWay('ng-value')
- void set value(val) { this._value = val; }
- dynamic get value => _value == null ? (element as dynamic).value : _value;
+ readValue(dom.Element element) {
+ assert(this.element == null || element == this.element);
+ return this.element == null ? (element as dynamic).value : value;
+ }
}
/**
- * Usage:
- *
- * <input type=checkbox
- * ng-model=model
- * [ng-true-value=expr]>
- *
- * The initial value of the expression bound to this directive is assigned to
- * the model when the input is checked. Note that the expression can be of any
- * type, not just [String]. Also see [InputCheckboxDirective], [NgFalseValue].
+ * `ng-true-value` allows you to select any expression to be set to
+ * `ng-model` when checkbox is selected on `<input type="checkbox">`.
*/
-@Decorator(selector: 'input[type=checkbox][ng-model][ng-true-value]')
+@NgDirective(selector: '[ng-true-value]')
class NgTrueValue {
final dom.Element element;
@NgOneWay('ng-true-value')
- var value = true;
+ var value;
+
+ NgTrueValue(this.element);
- NgTrueValue([this.element]);
+ readValue(dom.Element element) {
+ assert(this.element == null || element == this.element);
+ return this.element == null ? true : value;
+ }
- bool isValue(val) => element == null ? toBool(val) : val == value;
+ isValue(dom.Element element, value) {
+ assert(this.element == null || element == this.element);
+ return this.element == null ? toBool(value) : value == this.value;
+ }
}
/**
- * Usage:
- *
- * <input type=checkbox
- * ng-model=model
- * [ng-false-value=expr]>
- *
- * The initial value of the expression bound to this directive is assigned to
- * the model when the input is unchecked. Note that the expression can be of any
- * type, not just [String]. Also see [InputCheckboxDirective], [NgTrueValue].
+ * `ng-false-value` allows you to select any expression to be set to
+ * `ng-model` when checkbox is deselected<input type="checkbox">`.
*/
-@Decorator(selector: 'input[type=checkbox][ng-model][ng-false-value]')
+@NgDirective(selector: '[ng-false-value]')
class NgFalseValue {
final dom.Element element;
@NgOneWay('ng-false-value')
- var value = false;
+ var value;
+
+ NgFalseValue(this.element);
- NgFalseValue([this.element]);
+ readValue(dom.Element element) {
+ assert(this.element == null || element == this.element);
+ return this.element == null ? false : value;
+ }
}
/**
@@ -731,44 +376,39 @@ class NgFalseValue {
* <input type="radio" ng-model="category">
*
* This creates a two way databinding between the expression specified in
- * ng-model and the range input elements in the DOM. If the ng-model value is
+ * ng-model and the range input elements in the DOM.  If the ng-model value is
* set to a value not corresponding to one of the radio elements, then none of
* the radio elements will be check. Otherwise, only the corresponding input
* element in the group is checked. Likewise, when a radio button element is
* checked, the model is updated with its value. Radio buttons that have a
* `name` attribute are left alone. Those that are missing the attribute will
* have a unique `name` assigned to them. This sequence goes `001`, `001`, ...
- * `009`, `00A`, `00Z`, `010`, and so on using more than 3 characters for the
+ * `009`, `00A`, `00Z`, `010`, … and so on using more than 3 characters for the
* name when the counter overflows.
*/
-@Decorator(
- selector: 'input[type=radio][ng-model]',
- module: NgValue.moduleFactory)
-class InputRadio {
+@NgDirective(selector: 'input[type=radio][ng-model]')
+class InputRadioDirective {
final dom.RadioButtonInputElement radioButtonElement;
final NgModel ngModel;
final NgValue ngValue;
final Scope scope;
- InputRadio(dom.Element this.radioButtonElement, this.ngModel,
- this.scope, this.ngValue, NodeAttrs attrs) {
+ InputRadioDirective(dom.Element this.radioButtonElement, this.ngModel,
+ this.scope, this.ngValue, NodeAttrs attrs) {
// If there's no "name" set, we'll set a unique name. This ensures
// less surprising behavior about which radio buttons are grouped together.
if (attrs['name'] == '' || attrs['name'] == null) {
attrs["name"] = _uidCounter.next();
}
ngModel.render = (value) {
- scope.rootScope.domWrite(() {
- radioButtonElement.checked = (value == ngValue.value);
- });
+ radioButtonElement.checked = (value == ngValue.readValue(radioButtonElement));
};
- radioButtonElement
- ..onClick.listen((_) {
- if (radioButtonElement.checked) ngModel.viewValue = ngValue.value;
- })
- ..onBlur.listen((e) {
- ngModel.markAsTouched();
- });
+ radioButtonElement.onClick.listen((_) {
+ if (radioButtonElement.checked) {
+ ngModel.dirty = true;
+ ngModel.viewValue = ngValue.readValue(radioButtonElement);
+ }
+ });
}
}
@@ -778,18 +418,18 @@ class InputRadio {
* <span contenteditable= ng-model="name">
*
* This creates a two way databinding between the expression specified in
- * ng-model and the html element in the DOM. If the ng-model value is
+ * ng-model and the html element in the DOM.  If the ng-model value is
* `null`, it is treated as equivalent to the empty string for rendering
* purposes.
*/
-@Decorator(selector: '[contenteditable][ng-model]')
-class ContentEditable extends InputTextLike {
- ContentEditable(dom.Element inputElement, NgModel ngModel, Scope scope)
+@NgDirective(selector: '[contenteditable][ng-model]')
+class ContentEditableDirective extends InputTextLikeDirective {
+ ContentEditableDirective(dom.Element inputElement, NgModel ngModel,
+ Scope scope)
: super(inputElement, ngModel, scope);
- // The implementation is identical to InputTextLike but use innerHtml instead of value
- String get typedValue => (inputElement as dynamic).innerHtml;
- void set typedValue(String value) {
- (inputElement as dynamic).innerHtml = (value == null) ? '' : value;
- }
+ // The implementation is identical to InputTextLikeDirective but use innerHtml instead of value
+ get typedValue => (inputElement as dynamic).innerHtml;
+ set typedValue(String value) =>
+ (inputElement as dynamic).innerHtml = (value == null) ? '' : value;
}
« no previous file with comments | « third_party/pkg/angular/lib/directive/ng_include.dart ('k') | third_party/pkg/angular/lib/directive/ng_model_select.dart » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698