elementref

Difference between ElementRef and TemplateRef in angular4

由 岁酱吖の 提交于 2020-06-25 02:28:42
问题 i have seen many examples of ElemenetRef and TemplateRef which got me more confused. what is the difference between ElementRef and TemplateRef why we should use one over another HTML <ng-template #element> <div style="border:solid 3px yellow;width:250px; height:250px;position:relative;top:0px;"> this is my element </div> </ng-template> <ng-container #template> </ng-container> .ts file @ViewChild('element', { read: TemplateRef }) element: TemplateRef<any>; @ViewChild('template', { read:

angular templateRef nativeElement is an empty comment instead of original element

由 一世执手 提交于 2020-05-29 03:56:06
问题 I am developing an angular directive that converts dropdownlist to radioListbox. here is my initial code : import { Directive, Input, TemplateRef, ViewContainerRef,OnInit } from '@angular/core'; @Directive({ selector: '[radioList]' }) export class RadioListDirective implements OnInit { constructor(private templateRef: TemplateRef<any>, private vcRef: ViewContainerRef) { } ngOnInit() { console.log(this.templateRef); this.vcRef.createEmbeddedView(this.templateRef); } } and <div> test </div>

ElementRef is undefined

由 ╄→尐↘猪︶ㄣ 提交于 2019-12-11 23:14:12
问题 I’m working in an angular 6 application. I have a textarea that I’d like to give focus to as soon as the page loads. I’m not able to do so. Here is what the page looks like: <div fxLayoutAlign="begin"> <button mat-button color="primary" [routerLink]="['/Administration']"> <i class="far fa-arrow-alt-circle-left"></i> Back to Administration </button> </div> <div class="app-loading" *ngIf="_loading"> <mat-spinner diameter=100></mat-spinner> </div> <div *ngIf="!_loading"> <div class=

Creating instance of component and passing to another component rendering as [object HTMLelement]

由 丶灬走出姿态 提交于 2019-12-11 19:47:17
问题 From my component (ex. Component), I'm trying to instantiate an Angular component (ex. CustomComponent), set some properties, and send it over to a table (ex. CustomTable) for rendering, but I keep getting [object HTMLElement] instead of the rendered element in the table cell. Here's my setup: Component.html <custom-table [data]="tableData"...></custom-table> <custom-component #rowDetailTemplate></custom-component> Component.ts @Input() data: Array<CustomDataSource>; @ViewChild(

Angular - Focus on input with dynamic IDs on click

由 你。 提交于 2019-12-02 20:19:34
问题 *There are a lot of similar questions but I have not found a true duplicate that answers my question Apologies if I missed something. I have a page with several inputs/buttons (The same component repeated) and need to focus on the correct input upon button click. I have tried variations of elementRef, nativeElement, focusing based on the ID... but I can only get it to focus on the first one in the DOM or specific ones... <ng-template #myTemplate let-context="context"> <input #foo [id]="

Angular - Focus on input with dynamic IDs on click

由 时光毁灭记忆、已成空白 提交于 2019-12-02 12:25:55
*There are a lot of similar questions but I have not found a true duplicate that answers my question Apologies if I missed something. I have a page with several inputs/buttons (The same component repeated) and need to focus on the correct input upon button click. I have tried variations of elementRef, nativeElement, focusing based on the ID... but I can only get it to focus on the first one in the DOM or specific ones... <ng-template #myTemplate let-context="context"> <input #foo [id]="'myInput'+context.id" /> <button class="btn" [id]="'btnAction'+context.id (click)="focusOnInput()"></button>
订阅 elementref