diff --git a/packages/compiler/src/template_parser/template_preparser.ts b/packages/compiler/src/template_parser/template_preparser.ts
index 2c5889cae6c0..fb994afaa6e8 100644
--- a/packages/compiler/src/template_parser/template_preparser.ts
+++ b/packages/compiler/src/template_parser/template_preparser.ts
@@ -14,7 +14,7 @@ const LINK_ELEMENT = 'link';
 const LINK_STYLE_REL_ATTR = 'rel';
 const LINK_STYLE_HREF_ATTR = 'href';
 const LINK_STYLE_REL_VALUE = 'stylesheet';
-const STYLE_ELEMENTS: ReadonlySet<string> = new Set([':svg:style', 'style']);
+const STYLE_ELEMENT = 'style';
 const SCRIPT_ELEMENTS: ReadonlySet<string> = new Set([':svg:script', 'script']);
 const NG_NON_BINDABLE_ATTR = 'ngNonBindable';
 const NG_PROJECT_AS = 'ngProjectAs';
@@ -50,7 +50,7 @@ export function preparseElement(ast: html.Element): PreparsedElement {
   let type = PreparsedElementType.OTHER;
   if (isNgContent(nodeName)) {
     type = PreparsedElementType.NG_CONTENT;
-  } else if (STYLE_ELEMENTS.has(nodeName)) {
+  } else if (STYLE_ELEMENT === nodeName) {
     type = PreparsedElementType.STYLE;
   } else if (SCRIPT_ELEMENTS.has(nodeName)) {
     type = PreparsedElementType.SCRIPT;
diff --git a/packages/compiler/test/render3/r3_template_transform_spec.ts b/packages/compiler/test/render3/r3_template_transform_spec.ts
index b30b5ee10234..7ecd2ec69931 100644
--- a/packages/compiler/test/render3/r3_template_transform_spec.ts
+++ b/packages/compiler/test/render3/r3_template_transform_spec.ts
@@ -917,7 +917,7 @@ describe('R3 template transform', () => {
     });
   });
 
-  describe('Ignored elements', () => {
+  describe('<script> and <style> elements', () => {
     it('should ignore <script> elements', () => {
       expectFromHtml('<script></script>a').toEqual([['Text', 'a']]);
     });
@@ -925,6 +925,14 @@ describe('R3 template transform', () => {
     it('should ignore <style> elements', () => {
       expectFromHtml('<style></style>a').toEqual([['Text', 'a']]);
     });
+
+    it('should not ignore namespaced SVG <style> elements', () => {
+      expectFromHtml('<svg><style>.a { fill: none; }</style></svg>').toEqual([
+        ['Element', ':svg:svg'],
+        ['Element', ':svg:style'],
+        ['Text', '.a { fill: none; }'],
+      ]);
+    });
   });
 
   describe('<link rel="stylesheet">', () => {