34 lines
		
	
	
		
			923 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
		
		
			
		
	
	
			34 lines
		
	
	
		
			923 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
|  | ## 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
 | ||
|  | ```ts | ||
|  | 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
 | ||
|  | ```ts | ||
|  | 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'); | ||
|  |   } | ||
|  | } | ||
|  | ``` |