Merge branch 'Sandreu-array-model-watch' into development

Author: davidlgj

src/directives/array.js

@@ -1,8 +1,8 @@
 /**
  * Directive that handles the model arrays
  */
-angular.module('schemaForm').directive('sfArray', ['sfSelect', 'schemaForm', 'sfValidator',
-  function(sfSelect, schemaForm, sfValidator) {
+angular.module('schemaForm').directive('sfArray', ['sfSelect', 'schemaForm', 'sfValidator', 'sfPath',
+  function(sfSelect, schemaForm, sfValidator, sfPath) {
 
     var setIndex = function(index) {
       return function(form) {
@@ -29,6 +29,14 @@ angular.module('schemaForm').directive('sfArray', ['sfSelect', 'schemaForm', 'sf
           // other hand it enables two way binding.
           var list = sfSelect(form.key, scope.model);
 
+          // We only modify the same array instance but someone might change the array from
+          // the outside so let's watch for that. We use an ordinary watch since the only case
+          // we're really interested in is if its a new instance.
+          scope.$watch('model' + sfPath.normalize(form.key), function() {
+            list = sfSelect(form.key, scope.model);
+            scope.modelArray = list;
+          });
+
           // Since ng-model happily creates objects in a deep path when setting a
           // a value but not arrays we need to create the array.
           if (angular.isUndefined(list)) {
@@ -48,7 +56,7 @@ angular.module('schemaForm').directive('sfArray', ['sfSelect', 'schemaForm', 'sf
             if (form.items.length > 1) {
               subForm = {
                 type: 'section',
-                items: form.items.map(function(item){
+                items: form.items.map(function(item) {
                   item.ngModelOptions = form.ngModelOptions;
                   item.readonly = form.readonly;
                   return item;

test/directives/schema-form-test.js

@@ -1619,5 +1619,78 @@ describe('directive',function(){
       tmpl.children().eq(0).find('select').eq(0).find('option').eq(2).text().trim().should.be.eq('The A');
     });
   });
+  
+  
+  it('should update array form on model array ref change',function(){
+
+    inject(function($compile,$rootScope){
+      var scope = $rootScope.$new();
+      scope.person = {
+        names:[
+          {
+            firstname: 'Bill',
+            lastname: 'Murray'
+          },{
+            firstname: 'Ghost',
+            lastname: 'Buster'
+          }
+        ]
+      };
+
+      scope.schema = {
+        "type": "object",
+        "properties": {
+          "names": {
+            "type": "array",
+            "items": {
+              "type": "object",
+              "title": "subform",
+              "properties": {
+                "firstname": {
+                  "type": "string"
+                },
+                "lastname": {
+                  "type": "string"
+                }
+              }
+            }
+          }
+        }
+      };
+
+      scope.form = ["*"];
+
+      var tmpl = angular.element('<form sf-schema="schema" sf-form="form" sf-model="person"></form>');
+
+      $compile(tmpl)(scope);
+      $rootScope.$apply();
+
+      tmpl.children().eq(0).find('ol').children().length.should.be.eq(2);
+      
+      var new_names = [
+          {
+            firstname: 'Bill',
+            lastname: 'Murray'
+          },
+          {
+            firstname: 'Harold',
+            lastname: 'Ramis'
+          },{
+            firstname: 'Dan',
+            lastname: 'Aykroyd'
+          },{
+            firstname: 'Ghost',
+            lastname: 'Buster'
+          }
+        ];
+        
+      scope.person.names = new_names;
+      
+      $rootScope.$apply();
+      
+      tmpl.children().eq(0).find('ol').children().length.should.be.eq(4);
+    });
+  });
+
 
 });