angular-cn/packages/core/schematics/migrations/renderer-to-renderer2
Kara Erickson f289411fa9 docs(core): add migration guide links to schematics (#33258)
Angular v9 schematics should print out a link to the migration
guide associated with each schematic. This way, users have an
easy way to find more information about the automatic code
transformations they will see with `ng update`.

PR Close #33258
2019-10-18 18:18:37 -04: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 docs(core): add migration guide links to schematics (#33258) 2019-10-18 18:18:37 -04: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');
  }
}