feat(forms): make valueChanges and statusChanges available on abstract control directives

Author: kara

modules/@angular/forms/src/directives/abstract_control_directive.ts

@@ -6,11 +6,13 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {Observable} from '../facade/async';
 import {unimplemented} from '../facade/exceptions';
 import {isPresent} from '../facade/lang';
 import {AbstractControl} from '../model';
 
 
+
 /**
  * Base class for control directives.
  *
@@ -37,5 +39,13 @@ export abstract class AbstractControlDirective {
 
   get untouched(): boolean { return isPresent(this.control) ? this.control.untouched : null; }
 
+  get statusChanges(): Observable<any> {
+    return isPresent(this.control) ? this.control.statusChanges : null;
+  }
+
+  get valueChanges(): Observable<any> {
+    return isPresent(this.control) ? this.control.valueChanges : null;
+  }
+
   get path(): string[] { return null; }
 }

modules/@angular/forms/test/directives_spec.ts

@@ -141,6 +141,8 @@ export function main() {
         expect(form.dirty).toBe(formModel.dirty);
         expect(form.touched).toBe(formModel.touched);
         expect(form.untouched).toBe(formModel.untouched);
+        expect(form.statusChanges).toBe(formModel.statusChanges);
+        expect(form.valueChanges).toBe(formModel.valueChanges);
       });
 
       describe('addControl', () => {
@@ -295,6 +297,8 @@ export function main() {
         expect(form.dirty).toBe(formModel.dirty);
         expect(form.touched).toBe(formModel.touched);
         expect(form.untouched).toBe(formModel.untouched);
+        expect(form.statusChanges).toBe(formModel.statusChanges);
+        expect(form.valueChanges).toBe(formModel.valueChanges);
       });
 
       describe('addControl & addFormGroup', () => {
@@ -367,6 +371,8 @@ export function main() {
         expect(controlGroupDir.dirty).toBe(formModel.dirty);
         expect(controlGroupDir.touched).toBe(formModel.touched);
         expect(controlGroupDir.untouched).toBe(formModel.untouched);
+        expect(controlGroupDir.statusChanges).toBe(formModel.statusChanges);
+        expect(controlGroupDir.valueChanges).toBe(formModel.valueChanges);
       });
     });
 
@@ -382,6 +388,8 @@ export function main() {
         expect(controlDir.dirty).toBe(control.dirty);
         expect(controlDir.touched).toBe(control.touched);
         expect(controlDir.untouched).toBe(control.untouched);
+        expect(controlDir.statusChanges).toBe(control.statusChanges);
+        expect(controlDir.valueChanges).toBe(control.valueChanges);
       };
 
       beforeEach(() => {
@@ -431,6 +439,8 @@ export function main() {
         expect(ngModel.dirty).toBe(control.dirty);
         expect(ngModel.touched).toBe(control.touched);
         expect(ngModel.untouched).toBe(control.untouched);
+        expect(ngModel.statusChanges).toBe(control.statusChanges);
+        expect(ngModel.valueChanges).toBe(control.valueChanges);
       });
 
       it('should set up validator', fakeAsync(() => {
@@ -469,6 +479,8 @@ export function main() {
         expect(controlNameDir.dirty).toBe(formModel.dirty);
         expect(controlNameDir.touched).toBe(formModel.touched);
         expect(controlNameDir.untouched).toBe(formModel.untouched);
+        expect(controlNameDir.statusChanges).toBe(formModel.statusChanges);
+        expect(controlNameDir.valueChanges).toBe(formModel.valueChanges);
       });
     });
   });

modules/@angular/forms/test/integration_spec.ts

@@ -1247,10 +1247,10 @@ export function main() {
            let formValue: Object;
 
            ObservableWrapper.subscribe(
-               form.form.statusChanges, (status: string) => { formValidity = status; });
+               form.statusChanges, (status: string) => { formValidity = status; });
 
            ObservableWrapper.subscribe(
-               form.form.valueChanges, (value: string) => { formValue = value; });
+               form.valueChanges, (value: string) => { formValue = value; });
 
            tick();
 

tools/public_api_guard/forms/index.d.ts

@@ -50,10 +50,12 @@ export declare abstract class AbstractControlDirective {
     };
     path: string[];
     pristine: boolean;
+    statusChanges: Observable<any>;
     touched: boolean;
     untouched: boolean;
     valid: boolean;
     value: any;
+    valueChanges: Observable<any>;
 }
 
 export declare class CheckboxControlValueAccessor implements ControlValueAccessor {