fix($compile): prevent inlined JSON values in directive templates from being broken by a wrong replacement of '}}' with the user-defined endSymbol.

Request Type: bug

How to reproduce:

1. Change the *startSymbol* and *endSymbol* in *$interpolateProvider*.
2. Put this inside a Directive template:
```
<div data-context='{"context":{"id":3,"type":"page"}}">
```
Result: the '}}' at the end of the embedded JSON data gets transformed to the endSymbol defined by the developer.

Component(s): $compile

Impact: small

Complexity: medium

This issue is related to: 

**Detailed Description:**



**Other Comments:**

Discussion about this in a previous PR: https://github.com/angular/angular.js/pull/6453
What if we did it like this instead:

```js
template.replace(/\{\{(.*?)\}\}/g, function(_, expr) {
  return startSymbol + expr + endSymbol;
});
```

I could be wrong (and probably am slightly off on the syntax here), but I would expect this to work a lot better, and be significantly less code.