diff --git a/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts b/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts index 49b2c528ad1..5224b734dd6 100644 --- a/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts +++ b/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts @@ -68,8 +68,8 @@ export function migrateIf(template: string): } function migrateNgIf(etm: ElementToMigrate, tmpl: string, offset: number): Result { - const matchThen = etm.attr.value.match(/;?\s*then/gm); - const matchElse = etm.attr.value.match(/;?\s*else/gm); + const matchThen = etm.attr.value.match(/[^\w\d];?\s*then/gm); + const matchElse = etm.attr.value.match(/[^\w\d];?\s*else/gm); if (etm.thenAttr !== undefined || etm.elseAttr !== undefined) { // bound if then / if then else diff --git a/packages/core/schematics/test/control_flow_migration_spec.ts b/packages/core/schematics/test/control_flow_migration_spec.ts index 25291ca0bd3..d61624eb34c 100644 --- a/packages/core/schematics/test/control_flow_migration_spec.ts +++ b/packages/core/schematics/test/control_flow_migration_spec.ts @@ -425,6 +425,37 @@ describe('control flow migration', () => { ].join('\n')); }); + it('should migrate an if else case with condition that has `then` in the string', async () => { + writeFile('/comp.ts', ` + import {Component} from '@angular/core'; + import {NgIf,NgIfElse} from '@angular/common'; + + @Component({ + templateUrl: './comp.html' + }) + class Comp { + show = false; + } + `); + + writeFile('/comp.html', [ + `
`, + ` Hello!`, + `
`, + ].join('\n')); + + await runMigration(); + const content = tree.readContent('/comp.html'); + + expect(content).toBe([ + `@if (!(isAuthenticated$ | async) && !reauthRequired) {`, + `
`, + ` Hello!`, + `
`, + `}`, + ].join('\n')); + }); + it('should migrate an if case on a container', async () => { writeFile('/comp.ts', ` import {Component} from '@angular/core';