diff --git a/packages/core/schematics/ng-generate/control-flow-migration/util.ts b/packages/core/schematics/ng-generate/control-flow-migration/util.ts
index 1e9f2b71308d..2e83f8d3f19a 100644
--- a/packages/core/schematics/ng-generate/control-flow-migration/util.ts
+++ b/packages/core/schematics/ng-generate/control-flow-migration/util.ts
@@ -471,17 +471,18 @@ export function getMainBlock(etm: ElementToMigrate, tmpl: string, offset: number
// the beginning of the updated string in the main block, for example:
let start = tmpl.slice(etm.start(offset), attrStart) + tmpl.slice(valEnd, childStart);
+ // the middle is the actual contents of the element
+ const middle = tmpl.slice(childStart, childEnd);
+ // the end is the closing part of the element, example:
+ let end = tmpl.slice(childEnd, etm.end(offset));
if (etm.shouldRemoveElseAttr()) {
// this removes a bound ngIfElse attribute that's no longer needed
+ // this could be on the start or end
start = start.replace(etm.getElseAttrStr(), '');
+ end = end.replace(etm.getElseAttrStr(), '');
}
- // the middle is the actual contents of the element
- const middle = tmpl.slice(childStart, childEnd);
- // the end is the closing part of the element, example:
- const end = tmpl.slice(childEnd, etm.end(offset));
-
return {start, middle, end};
}
diff --git a/packages/core/schematics/test/control_flow_migration_spec.ts b/packages/core/schematics/test/control_flow_migration_spec.ts
index d61624eb34c8..da3f8a58a6a3 100644
--- a/packages/core/schematics/test/control_flow_migration_spec.ts
+++ b/packages/core/schematics/test/control_flow_migration_spec.ts
@@ -611,6 +611,45 @@ describe('control flow migration', () => {
].join('\n'));
});
+ it('should migrate a bound NgIfElse case with ng-templates and remove all unnecessary attributes',
+ async () => {
+ writeFile('/comp.ts', `
+ import {Component} from '@angular/core';
+ import {NgIf} from '@angular/common';
+
+ @Component({
+ templateUrl: './comp.html'
+ })
+ class Comp {
+ show = false;
+ }
+ `);
+
+ writeFile('/comp.html', [
+ ``,
+ `Foo`,
+ `Bar`,
+ ].join('\n'));
+
+ await runMigration();
+ const content = tree.readContent('/comp.html');
+
+ expect(content).toBe([
+ `@if (fooTemplate) {`,
+ ` `,
+ `} @else {`,
+ ` Bar`,
+ `}`,
+ `Foo\n`,
+ ].join('\n'));
+ });
+
it('should migrate a bound NgIfThenElse case with ng-templates with i18n', async () => {
writeFile('/comp.ts', `
import {Component} from '@angular/core';