fix($interpolate): use the first end symbol that forms a valid expression

When an interpolation string has multiple end symbol choices, pick the
occurrence that forms a valid expression

Closes #8642

Author: lgalfaso

src/ng/interpolate.js

@@ -201,9 +201,20 @@ function $InterpolateProvider() {
           if (index !== startIndex) {
             concat.push(unescapeText(text.substring(index, startIndex)));
           }
-          exp = text.substring(startIndex + startSymbolLength, endIndex);
-          expressions.push(exp);
-          parseFns.push($parse(exp, parseStringifyInterceptor));
+          do {
+            try {
+              exp = text.substring(startIndex + startSymbolLength, endIndex);
+              parseFns.push($parse(exp, parseStringifyInterceptor));
+              expressions.push(exp);
+            } catch (e) {
+              endIndex = text.indexOf(endSymbol, endIndex + 1);
+              if (endIndex === -1) {
+                throw e;
+              } else {
+                exp = undefined;
+              }
+            }
+          } while (isUndefined(exp));
           index = endIndex + endSymbolLength;
           expressionPositions.push(concat.length);
           concat.push('');

test/ng/interpolateSpec.js

@@ -105,7 +105,7 @@ describe('$interpolate', function() {
       expect(function() {
         $interpolate('{{\\{\\{foo\\}\\}}}')(obj);
       }).toThrowMinErr('$parse', 'lexerr',
-        'Lexer Error: Unexpected next character  at columns 0-0 [\\] in expression [\\{\\{foo\\}\\]');
+        'Lexer Error: Unexpected next character  at columns 0-0 [\\] in expression [\\{\\{foo\\}\\}]');
     }));
 
 
@@ -116,6 +116,14 @@ describe('$interpolate', function() {
     it('should evaluate expressions between escaped start/end symbols', inject(function($interpolate) {
       expect($interpolate('\\{\\{Hello, {{bar}}!\\}\\}')(obj)).toBe('{{Hello, World!}}');
     }));
+
+    it('should pick the first end symbol location that forms a valid expression', inject(function($interpolate) {
+      expect($interpolate('{{{}}}')(obj)).toBe('{}');
+      expect($interpolate('{{"{{ }}"}}')(obj)).toBe('{{ }}');
+      expect($interpolate('{{{foo: "bar"}}}')(obj)).toBe('{"foo":"bar"}');
+      expect($interpolate('{{{foo: {"bar": "baz"}}}}')(obj)).toBe('{"foo":{"bar":"baz"}}');
+      expect($interpolate('{{[{foo: {"bar": "baz"}}]}}')(obj)).toBe('[{"foo":{"bar":"baz"}}]');
+    }));
   });