Skip to content

Commit

Permalink
fix(migrations): Fixes a bug in the ngFor pre-v5 alias translation
Browse files Browse the repository at this point in the history
The logic that transformed the value to get the alias name was incorrect.

fixes: #52522
  • Loading branch information
thePunderWoman committed Nov 6, 2023
1 parent 63777d2 commit 1b8dd28
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -347,7 +347,7 @@ function migrateNgFor(etm: ElementToMigrate, tmpl: string, offset: number): Resu
// if the aliased variable is the index, then we store it
if (aliasParts[1].trim() === 'index') {
// 'let myIndex' -> 'myIndex'
aliasedIndex = aliasParts[0].trim().split(/\s+as\s+/)[1];
aliasedIndex = aliasParts[0].replace('let', '').trim();
}
}
// declared with `index as myIndex`
Expand Down
47 changes: 47 additions & 0 deletions packages/core/schematics/test/control_flow_migration_spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -963,6 +963,53 @@ describe('control flow migration', () => {
'template: `<ul>@for (itm of items; track itm; let index = $index) {<li>{{itm.text}}</li>}</ul>`');
});

it('should migrate with an old style alias', async () => {
writeFile('/comp.ts', `
import {Component} from '@angular/core';
import {NgFor} from '@angular/common';
interface Item {
id: number;
text: string;
}
@Component({
imports: [NgFor],
templateUrl: 'comp.html',
})
class Comp {
items: Item[] = [{id: 1, text: 'blah'},{id: 2, text: 'stuff'}];
}
`);

writeFile('/comp.html', [
`<tbody>`,
` <tr *ngFor="let row of field(); let y = index; trackBy: trackByIndex">`,
` <td`,
` *ngFor="let cell of row; let x = index; trackBy: trackByIndex"`,
` ></td>`,
` </tr>`,
`</tbody>`,
].join('\n'));

await runMigration();
const actual = tree.readContent('/comp.html');

const expected = [
`<tbody>`,
` @for (row of field(); track trackByIndex(y, row); let y = $index) {`,
` <tr>`,
` @for (cell of row; track trackByIndex(x, cell); let x = $index) {`,
` <td\n `,
` ></td>`,
`}`,
` </tr>`,
`}`,
`</tbody>`,
].join('\n');

expect(actual).toBe(expected);
});

it('should migrate with an index alias with no spaces', async () => {
writeFile('/comp.ts', `
import {Component} from '@angular/core';
Expand Down

0 comments on commit 1b8dd28

Please sign in to comment.