MERGE: ng:options

Author: mhevery

docs/angular.element.ngdoc

@@ -32,6 +32,7 @@ raw DOM references.
 - [data()](http://api.jquery.com/data/)
 - [hasClass()](http://api.jquery.com/hasClass/)
 - [parent()](http://api.jquery.com/parent/)
+- [prepend()](http://api.jquery.com/prepend/)
 - [remove()](http://api.jquery.com/remove/)
 - [removeAttr()](http://api.jquery.com/removeAttr/)
 - [removeClass()](http://api.jquery.com/removeClass/)

src/parser.js

@@ -239,8 +239,8 @@ function parser(text, json){
       pipeFunction =
         function (){ throwError("is not valid json", {text:text, index:0}); };
   }
-  //TODO: Should'nt all of the public methods have assertAllConsumed?
-  //TODO: I think these should be public instead of scope.$eval() being the enterenece.
+  //TODO: Shouldn't all of the public methods have assertAllConsumed?
+  //TODO: I think these should be public as part of the parser api instead of scope.$eval().
   return {
       assignable: assertConsumed(assignable),
       primary: assertConsumed(primary),
@@ -762,8 +762,7 @@ function compileExpr(expr) {
   return parser(expr).statements();
 }
 
-//TODO(misko): Deprecate? Remove!
-// I think that compilation should be a service.
+//TODO(misko): Deprecate? Remove! I think that compilation should be a service.
 function expressionCompile(exp){
   if (typeof exp === $function) return exp;
   var fn = compileCache[exp];

src/widgets.js

@@ -541,16 +541,22 @@ angularWidget('button', inputWidgetSelector);
  * @name angular.directive.ng:options
  *
  * @description
- * Dynamically generate a list of `option`s for a `<select>` element. Normaly the 'ng:options'
- * directive does not require you to specify any `<option>` elements, however if you wish
- * to support `null` value then a special `<option value="">null selection text</option>` can be
- * added to the `<select>`.
+ * Replace this whole paragraph with:
  *
- * NOTE: The normal aproach of {@link angular.widget.@ng:repeat ng:repeat} does not work here for
- * several reasons:
+ * Dynamically generate a list of `<option>` elements for a `<select>` element using the array
+ * obtained by evaluating the `ng:options` expression.
  *
- *   * option requires strings, where as dynamic arrays are composed of objects.
- *   * {@link angular.widget.@ng:repeat ng:repeat} unrolles after the select binds causing
+ * Optionally, a single hard-coded `<option>` element, with the value set to an empty string, can
+ * be nested into the `<select>` element. This element will then represent `null` or "not selected"
+ * option. See example below for demonstration.
+ *
+ * Note: `ng:options` provides iterator facility for `<option>` element which must be used instead
+ * of {@link angular.widget.@ng:repeat ng:repeat}. `ng:repeat` is not suitable for use with
+ * `<option>` element because of the following reasons:
+ *
+ *   * `option` value attribuet requires a string, where as the array we are trying to unroll is
+ *     composed of objects.
+ *   * {@link angular.widget.@ng:repeat ng:repeat} unrolls after the select binds causing
  *     incorect rendering on most browsers.
  *   * binding to a value not in list confuses most browsers.
  *
@@ -614,6 +620,7 @@ angularWidget('button', inputWidgetSelector);
 var NG_OPTIONS_REGEXP = /^(.*)\s+for\s+([\$\w][\$\w\d]*)\s+in\s+(.*)$/;
 angularWidget('select', function(element){
   this.descend(true);
+  this.directives(true);
   var isMultiselect = element.attr('multiple');
   var expression = element.attr('ng:options');
   var match;
@@ -660,7 +667,7 @@ angularWidget('select', function(element){
         if (value == '?') {
           value = undefined;
         } else {
-          value = value == '' ? null : collection[value];
+          value = (value == '' ? null : collection[value]);
         }
       }
       if (value !== undefined) model.set(value);
@@ -680,6 +687,7 @@ angularWidget('select', function(element){
       var currentItem;
       var selectValue = '';
       var isMulti = isMultiselect;
+
       if (isMulti) {
         selectValue = new HashMap();
         if (modelValue && isNumber(length = modelValue.length)) {

test/directivesSpec.js

@@ -289,13 +289,13 @@ describe("directive", function(){
         }
       };
       var scope = compile('<div ng:controller="temp.Greeter"><div ng:controller="temp.ChildGreeter">{{greet("misko")}}</div></div>');
-      scope.$apply();
       expect(scope.greeting).not.toBeDefined();
       expect(scope.greeter.greeting).toEqual('hello');
       expect(scope.greeter.greet('misko')).toEqual('hello misko!');
       expect(scope.greeter.greeting).toEqual('hello');
       expect(scope.childGreeter.greeting).toEqual('hey');
       expect(scope.childGreeter.$parent.greeting).toEqual('hello');
+      scope.$flush();
       expect(scope.$element.text()).toEqual('hey dude!');
     });
 

test/widgetsSpec.js

@@ -586,8 +586,8 @@ describe("widget", function(){
 
     function createSelect(multiple, blank, unknown){
       select = jqLite(
-          '<select' + (multiple ? ' multiple' : '') +
-                 ' name="selected" ng:options="value.name for value in values">' +
+          '<select name="selected" ' + (multiple ? ' multiple' : '') +
+                 ' ng:options="value.name for value in values">' +
             (blank ? '<option value="">blank</option>' : '') +
             (unknown ? '<option value="?">unknown</option>' : '') +
           '</select>');
@@ -631,7 +631,7 @@ describe("widget", function(){
       createSingleSelect();
       scope.values = [];
       scope.$flush();
-      expect(select.find('option').length).toEqual(1); // becouse we add special empty option
+      expect(select.find('option').length).toEqual(1); // because we add special empty option
       expect(sortedHtml(select.find('option')[0])).toEqual('<option></option>');
 
       scope.values.push({name:'A'});
@@ -640,7 +640,6 @@ describe("widget", function(){
       expect(select.find('option').length).toEqual(1);
       expect(sortedHtml(select.find('option')[0])).toEqual('<option value="0">A</option>');
 
-
       scope.values.push({name:'B'});
       scope.$flush();
       expect(select.find('option').length).toEqual(2);