Repository: angular
Issue: XML prolog data being printed when including SVG in `templateUrl`
Labels: freq1: low,area: core,core: basic template syntax,type: use-case,cross-cutting: SVG,P4

<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅

Oh hi there! 😄

To expedite issue processing please search open and closed issues before submitting a new one.
Existing issues often contain information about workarounds, resolution, or progress updates.

🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->


# 🐞 Bug report

### Command (mark with an `x`)
<!-- Can you pin-point the command or commands that are effected by this bug? -->
<!-- ✍️edit: -->

- [ ] new
- [x] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc


### Is this a regression?

<!-- Did this behavior use to work in the previous version? -->
<!-- ✍️--> No

### Description

<!-- ✍️--> Since v8 we have been able to reference SVG files in the `templateUrl` of a component. However, if the the SVG includes an XML declaration, Angular prints the declaration on the screen and then displays the SVG as expected. Since XML prolog data is valid in an SVG file, but not for inline SVG elements in html, I would expect the compiler to strip out all XML prolog data when compiling SVG files.

## 🔬 Minimal Reproduction
<!--
Simple steps to reproduce this bug.

Please include: commands run (including args), packages added, related code changes.

If reproduction steps are not enough for reproduction of your issue, please create a minimal GitHub repository with the reproduction of the issue. 
A good way to make a minimal reproduction is to create a new app via `ng new repro-app` and add the minimum possible code to show the problem. 
Share the link to the repo below along with step-by-step instructions to reproduce the problem, as well as expected and actual behavior.

Issues that don't have enough info and can't be reproduced will be closed.

You can read more about issue submission guidelines here: https://github.com/angular/angular-cli/blob/master/CONTRIBUTING.md#-submitting-an-issue
-->
1.
```
ng new svg-app --defaults
ng g component svg --module app
```

2. Rename `svg.component.html` to `svg.component.svg` and replace contents with:
```
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="18" height="18" viewBox="0 0 18 18">
    <defs>
        <path id="a" d="M0 0h18v18H0V0z"/>
    </defs>
    <clipPath id="b">
        <use xlink:href="#a" overflow="visible"/>
    </clipPath>
    <path clip-path="url(#b)" d="M15 5H4C1.8 5 0 6.8 0 9s1.8 4 4 4h10v-1H4c-1.7 0-3-1.3-3-3s1.3-3 3-3h11c1.1 0 2 .9 2 2s-.9 2-2 2H6c-.6 0-1-.4-1-1s.4-1 1-1h8V7H6c-1.1 0-2 .9-2 2s.9 2 2 2h9c1.7 0 3-1.3 3-3s-1.3-3-3-3z"/>
</svg>
```
>*SVG copied from https://github.com/google/material-design-icons/blob/master/file/svg/design/ic_attachment_18px.svg?short_path=2fb6055*
3. Update the `templateUrl` in `svg.component.ts` to be `./svg.component.svg`
4. Add the `<app-svg></app-svg>` element tag to `app.component.html`
5. ng serve

## 🔥 Exception or Error
<pre><code>
// Example output 
&lt;?xml version="1.0" encoding="UTF-8"?>🔢 
</code></pre>


## 🌍 Your Environment
<pre><code>

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 8.3.19
Node: 12.8.1
OS: darwin x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.19
@angular-devkit/build-angular      0.803.19
@angular-devkit/build-ng-packagr   0.803.19
@angular-devkit/build-optimizer    0.803.19
@angular-devkit/build-webpack      0.803.19
@angular-devkit/core               8.3.19
@angular-devkit/schematics         8.3.19
@angular/cdk                       8.2.3
@angular/cli                       8.3.19
@angular/material                  8.2.3
@ngtools/webpack                   8.3.19
@schematics/angular                8.3.19
@schematics/update                 0.803.19
ng-packagr                         5.7.1
rxjs                               6.5.3
typescript                         3.5.3
webpack                            4.39.2
</code></pre>

**Anything else relevant?**
Same issue exists on 9.x release candidates.
Tested on Chrome and Safari (macOS)
Here is a StackBlitz repro: https://stackblitz.com/edit/angular-yvcjdp