feat(change_detection): json pipe

Closes #1957

modules/angular2/src/change_detection/change_detection.ts

@@ -7,6 +7,7 @@ import {ObservablePipeFactory} from './pipes/observable_pipe';
 import {PromisePipeFactory} from './pipes/promise_pipe';
 import {UpperCaseFactory} from './pipes/uppercase_pipe';
 import {LowerCaseFactory} from './pipes/lowercase_pipe';
+import {JsonPipeFactory} from './pipes/json_pipe';
 import {NullPipeFactory} from './pipes/null_pipe';
 import {ChangeDetection, ProtoChangeDetector, ChangeDetectorDefinition} from './interfaces';
 import {Injectable} from 'angular2/src/di/decorators';
@@ -55,12 +56,20 @@ export var uppercase: List < PipeFactory >= [new UpperCaseFactory(), new NullPip
  */
 export var lowercase: List < PipeFactory >= [new LowerCaseFactory(), new NullPipeFactory()];
 
+/**
+ * Json stringify transform.
+ *
+ * @exportedAs angular2/pipes
+ */
+export var json: List < PipeFactory >= [new JsonPipeFactory(), new NullPipeFactory()];
+
 export var defaultPipes = {
   "iterableDiff": iterableDiff,
   "keyValDiff": keyValDiff,
   "async": async,
   "uppercase": uppercase,
-  "lowercase": lowercase
+  "lowercase": lowercase,
+  "json": json
 };
 
 export var preGeneratedProtoDetectors = {};

modules/angular2/src/change_detection/pipes/json_pipe.ts

@@ -0,0 +1,80 @@
+import {isBlank, isPresent, CONST, Json} from 'angular2/src/facade/lang';
+import {Pipe, PipeFactory} from './pipe';
+
+// HACK: workaround for Traceur behavior.
+// It expects all transpiled modules to contain this marker.
+// TODO: remove this when we no longer use traceur
+export var __esModule = true;
+
+
+/**
+ * Implements json transforms to any object.
+ *
+ * # Example
+ *
+ * In this example we transform the user object to json.
+ *
+ *  ```
+ * @Component({
+ *   selector: "user-cmp"
+ * })
+ * @View({
+ *   template: "User: {{ user | json }}"
+ * })
+ * class Username {
+ *  user:Object
+ *  constructor() {
+ *    this.user = { name: "PatrickJS" };
+ *  }
+ * }
+ *
+ * ```
+ *
+ * @exportedAs angular2/pipes
+ */
+export class JsonPipe extends Pipe {
+  _latestRef: any;
+  _latestValue: any;
+  constructor() {
+    super();
+    this._latestRef = null;
+    this._latestValue = null;
+  }
+
+  onDestroy(): void {
+    if (isPresent(this._latestValue)) {
+      this._latestRef = null;
+      this._latestValue = null;
+    }
+  }
+
+  supports(obj): boolean { return true; }
+
+  transform(value): any {
+    if (value === this._latestRef) {
+      return this._latestValue;
+    } else {
+      return this._prettyPrint(value);
+    }
+  }
+
+  _prettyPrint(value) {
+    this._latestRef = value;
+    this._latestValue = Json.stringify(value);
+    return this._latestValue;
+  }
+}
+
+/**
+ * Provides a factory for [JsonPipeFactory].
+ *
+ * @exportedAs angular2/pipes
+ */
+@CONST()
+export class JsonPipeFactory extends PipeFactory {
+  constructor() { super(); }
+
+  supports(obj): boolean { return true; }
+
+  create(cdRef): Pipe { return new JsonPipe(); }
+}