DEV Community

Lessons learned from Angular's control flow migration script

The author details their team's experience migrating Angular code from the deprecated `NgIf`, `NgFor`, and `NgSwitch` directives to the new control flow syntax. They emphasize the importance of careful manual review after the migration script runs, avoiding large pull requests. The article cautions against making unrelated code cleanup changes during the migration to minimize risk. Specifically, it warns against converting negated `if` statements to `else` blocks and removing redundant `div` tags, as these can introduce subtle bugs. Replacing `let i = $index` with just `$index` is deemed a safe change. The author points out spacing issues with inline elements after migration, and offers a script to help identify potential problems. They highlight the benefits of using `track` in `@for` loops for performance, and describe the migration's handling of `ng-template else` blocks. The author also mentions that random HTML outside of `ngSwitchCase` blocks can cause issues. Finally, the migration script doesn't format code well and may leave empty lines after removing imports.
favicon
dev.to
dev.to
Create attached notes ...