angular-cn/packages/core/schematics/migrations/renderer-to-renderer2
Paul Gschwendtner d751ca7596 fix(core): renderer-to-renderer2 migration not migrating methods (#33571)
The `renderer-to-renderer2` migration currently does not work
properly in v9 because the migration relies on the type checker
for detecting references to `Renderer` from `@angular/core`.

This is contradictory since the `Renderer` is no longer
exported in v9 `@angular/core`. In order to make sure that
the migration still works in v9, and that we can rely on the
type checker for the best possible detection, we take advantage
of module augmentation and in-memory add the `Renderer` export
to the `@angular/core` module.

PR Close #33571
2019-11-05 22:05:17 +00:00
..
BUILD.bazel refactor(core): move renderer2 migration lint rule into google3 folder (#31817) 2019-08-09 10:46:45 -07:00
README.md feat(core): add automatic migration from Renderer to Renderer2 (#30936) 2019-07-03 09:03:37 -07:00
helpers.ts feat(core): add automatic migration from Renderer to Renderer2 (#30936) 2019-07-03 09:03:37 -07:00
index.ts fix(core): renderer-to-renderer2 migration not migrating methods (#33571) 2019-11-05 22:05:17 +00:00
migration.ts feat(core): add automatic migration from Renderer to Renderer2 (#30936) 2019-07-03 09:03:37 -07:00
util.ts feat(core): add automatic migration from Renderer to Renderer2 (#30936) 2019-07-03 09:03:37 -07:00

README.md

Renderer -> Renderer2 migration

Automatically migrates from Renderer to Renderer2 by changing method calls, renaming imports and renaming types. Tries to either map method calls directly from one renderer to the other, or if that's not possible, inserts custom helper functions at the bottom of the file.

Before

import { Renderer, ElementRef } from '@angular/core';

@Component({})
export class MyComponent {
  constructor(private _renderer: Renderer, private _elementRef: ElementRef) {}

  changeColor() {
    this._renderer.setElementStyle(this._element.nativeElement, 'color', 'purple');
  }
}

After

import { Renderer2, ElementRef } from '@angular/core';

@Component({})
export class MyComponent {
  constructor(private _renderer: Renderer2, private _elementRef: ElementRef) {}

  changeColor() {
    this._renderer.setStyle(this._element.nativeElement, 'color', 'purple');
  }
}