Mainly copyedits and prep for extension + example code cleanup & bug fix + fix bug in default color initialization
		
			
				
	
	
		
			44 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			Dart
		
	
	
	
	
	
			
		
		
	
	
			44 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			Dart
		
	
	
	
	
	
| // #docplaster
 | |
| // #docregion full
 | |
| import 'package:angular2/core.dart';
 | |
| 
 | |
| @Directive(selector: '[myHighlight]', host: const {
 | |
|   '(mouseenter)': 'onMouseEnter()',
 | |
|   '(mouseleave)': 'onMouseLeave()'
 | |
| })
 | |
| // #docregion class-1
 | |
| class HighlightDirective {
 | |
|   String _defaultColor = 'red';
 | |
|   final dynamic _el;
 | |
| 
 | |
|   HighlightDirective(ElementRef elRef) : _el = elRef.nativeElement;
 | |
|   // #enddocregion class-1
 | |
| 
 | |
|   // #docregion defaultColor
 | |
|   @Input() set defaultColor(String colorName) {
 | |
|     _defaultColor = (colorName ?? _defaultColor);
 | |
|   }
 | |
|   // #enddocregion defaultColor
 | |
|   // #docregion class-1
 | |
| 
 | |
|   // #docregion color
 | |
|   @Input('myHighlight') String highlightColor;
 | |
|   // #enddocregion color
 | |
|   
 | |
|   // #docregion mouse-enter
 | |
|   void onMouseEnter() { _highlight(highlightColor ?? _defaultColor); }
 | |
|   // #enddocregion mouse-enter
 | |
|   void onMouseLeave() { _highlight(); }
 | |
| 
 | |
|   void _highlight([String color]) {
 | |
|     if(_el != null) _el.style.backgroundColor = color;
 | |
|   }
 | |
| }
 | |
| // #enddocregion class-1
 | |
| // #enddocregion full
 | |
| /*
 | |
| // #docregion highlight
 | |
| @Input() String myHighlight;
 | |
| // #enddocregion highlight
 | |
| */
 |