fix(icon): stop breaking SVGs that have id references (#11465)

<!-- 
Filling out this template is required! Do not delete it when submitting a Pull Request! Without this information, your Pull Request may be auto-closed.
-->
## PR Checklist
Please check that your PR fulfills the following requirements:
- [X] The commit message follows [our guidelines](https://github.com/angular/material/blob/master/.github/CONTRIBUTING.md#-commit-message-format)
- [X] Tests for the changes have been added or this is not a bug fix / enhancement
- [X] Docs have been added, updated, or were not required

## PR Type
What kind of change does this PR introduce?
<!-- Please check the one that applies to this PR using "x". -->
```
[X] Bugfix
[ ] Enhancement
[ ] Documentation content changes
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Infrastructure changes
[ ] Other... Please describe:
```

## What is the current behavior?

<!-- Please describe the current behavior that you are modifying and link to one or more relevant issues. -->
When the same icon is used multiple times, they all have the same id.

Issue Number: 
Fixes #11395.
This fixes the issue found by @coennijhuis in PR #11342. 

## What is the new behavior?
When the same icon is used multiple times, they all have a different id. `_cache` followed by a number is appended to the id.

## Does this PR introduce a breaking change?
```
[ ] Yes
[X] No
```
<!-- If this PR contains a breaking change, please describe the impact and migration path for existing applications below. -->
<!-- Note that breaking changes are highly unlikely to get merged to master unless the validation is clear and the use case is critical. -->

## Other information

Author: EmielH

src/components/icon/icon.spec.js

@@ -456,17 +456,17 @@ describe('MdIcon service', function() {
     describe('$mdIcon() is passed an icon ID', function() {
 
       it('should append configured SVG single icon', function() {
-        var expected = updateDefaults('<svg><g id="android"></g></svg>');
+        var expected = new RegExp(updateDefaults('<svg><g id="android_cache[0-9]+"></g></svg>'));
         $mdIcon('android').then(function(el) {
-          expect(el.outerHTML).toEqual(expected);
+          expect(el.outerHTML).toMatch(expected);
         });
         $scope.$digest();
       });
 
       it('should append configured SVG icon from named group', function() {
-        var expected = updateDefaults('<svg xmlns="http://www.w3.org/2000/svg"><g id="s1"></g></svg>');
+        var expected = new RegExp(updateDefaults('<svg xmlns="http://www.w3.org/2000/svg"><g id="s1_cache[0-9]+"></g></svg>'));
         $mdIcon('social:s1').then(function(el) {
-          expect(el.outerHTML).toEqual(expected);
+          expect(el.outerHTML).toMatch(expected);
         });
         $scope.$digest();
       });
@@ -488,9 +488,9 @@ describe('MdIcon service', function() {
       });
 
       it('should append configured SVG icon from default group', function() {
-        var expected = updateDefaults('<svg xmlns="http://www.w3.org/2000/svg"><g id="c1"></g></svg>');
+        var expected = new RegExp(updateDefaults('<svg xmlns="http://www.w3.org/2000/svg"><g id="c1_cache[0-9]+"></g></svg>'));
         $mdIcon('c1').then(function(el) {
-          expect(el.outerHTML).toEqual(expected);
+          expect(el.outerHTML).toMatch(expected);
         });
         $scope.$digest();
       });
@@ -514,7 +514,7 @@ describe('MdIcon service', function() {
 
       it('should return correct SVG markup', function() {
         $mdIcon('android.svg').then(function(el) {
-          expect(el.outerHTML).toEqual(updateDefaults('<svg><g id="android"></g></svg>'));
+          expect(el.outerHTML).toMatch(new RegExp(updateDefaults('<svg><g id="android_cache[0-9]+"></g></svg>')));
         });
         $scope.$digest();
       });

src/components/icon/js/iconService.js

@@ -577,7 +577,7 @@ function MdIconService(config, $templateRequest, $q, $log, $mdUtil, $sce) {
     return function updateCache(icon) {
       iconCache[id] = isIcon(icon) ? icon : new Icon(icon, config[id]);
 
-      return iconCache[id].clone();
+      return transformClone(iconCache[id]);
     };
   }