Questions tagged [elementref]
78 questions
2
votes
1 answer
Angular: How to handle a null ElementRef?
In an Angular component, I display real-time data in a very complex way that requires the use of ElementRef for various purposes supporting UI interaction.
this.elRef.nativeElement.querySelector('.my-element')
As a result, I am running into a few…
DevMike
- 1,630
- 2
- 19
- 33
2
votes
2 answers
Unable to get nativeElement of ion-textarea in Ionic 4 to set height
I have a custom directive to adjust the ion-textarea height to autosize the height as text is entered rather than setting a fixed row height or having ugly scroll bars as the textarea fills up.
In Ionic-4 I am unable to get the nativeElement of the…
Rowie
- 243
- 5
- 17
2
votes
1 answer
Creating instance of component and passing to another component rendering as [object HTMLelement]
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…
TabsNotSpaces
- 1,224
- 10
- 22
2
votes
0 answers
How to assign angular directive to html element by using ElementRef and Renderer2?
I am developing the drag and drop application in Angular 6 and on drop operation, I am creating the new HTML element (elements like 'DIV', 'textarea' etc.), dynamically and assign styles, attributes, default x and y coordinates to it by using…
Baba Wanve
- 21
- 3
2
votes
1 answer
Error when running ng serve Angular5
I was running my angular 5 project with ng serve, then there is an error like this:
ERROR in
node_modules/@ng-bootstrap/ng-bootstrap/buttons/radio.d.ts(58,96):
error TS2315: Type 'ElementRef' is not generic.
…
Tessa Muliawati
- 85
- 1
- 1
- 4
2
votes
1 answer
What's the correct way to load and open a component inside a modal dialog in Angular4 --
I have a component called NewCustomerComponent and I want to load and display it through a modal popup in another page/component when a button is clicked. I have written the relevant bit of code [or so it seems]. But I am getting the following error…
Prabir Choudhury
- 143
- 1
- 18
2
votes
1 answer
Angular watch input value
What is the best practice to watch the value of an input HTML element? I need to dynamically add as much inputs as i want to. Hence, I cannot use ngModel. At this point I'm using ElementRef.
Binabiko
- 47
- 10
2
votes
2 answers
Angular 4 dynamic style update for dynamic ids
I have a number of dynamic "divs" each with their own dynamic "id" from database. In the background there's a service running in intervals of 15 seconds, each time pulling new data and updating the status which will be represented with a different…
Rodrigo Rubio
- 1,686
- 2
- 16
- 26
2
votes
0 answers
Selecting default value in bootstrap select picker using angular 4 programmatically
I am using bootstrap selectpicker in my angular 4 application and I have to default value to it from my type script code.
These are the jquery methods given in this documentation https://silviomoreto.github.io/bootstrap-select/methods/
I want to…
Mr.Gaja
- 173
- 2
- 3
- 12
1
vote
0 answers
How to create Unit test for ElementRef.nativeElement.querySelector()
I'm trying to test a component that has an ElementRef and accessing
import { Component, OnInit, ElementRef } from '@angular/core';
@Component({
selector: 'component',
templateUrl: '...',
styleUrls: ['...']
})
export class MyComponent…
user202
- 758
- 10
- 26
1
vote
1 answer
In Angular, how to I get the correct coordinates of an element after routing change?
I have a very small basic angular (14) SPA with a couple of routes. I'm using @ViewChild to get the coordinates of a particular element:
@ViewChild('testElement', { static: true }) testElement!: ElementRef;
and…
aburton
- 11
- 1
1
vote
1 answer
Whats the Angular way of cloning/moving an element into the body with all event listeners?
For example i have something like this:
FancyComponentWantsToShowAnOverlay.ts
...
ClickToDoSomething(): void {
// doing something
}
MoveOrCloneToBody(): void {
// do the magic
}
...
FancyComponentWantsToShowAnOverlay.html
...
*…
mdev
- 43
- 1
- 8
1
vote
1 answer
ElementRef is undefined when using @ViewChild
import {Component, ElementRef, HostBinding, ViewChild} from '@angular/core';
export class MainPage {
constructor(
el: ElementRef
) {
this.contentElement = el.nativeElement;
}
contentElement = null;
@ViewChild('wrapper', { static:…
장호정
- 41
- 7
1
vote
1 answer
How to unit test and mock parentElement of ElementRef - Angular 9
I have a scroll-animation component which i can add to some other components in order to display a scroll animation. The scroll animation will be shown when the parent component has scroll-bar.
export class ScrollIndicatorComponent implements…
Emil Kaminski
- 1,886
- 2
- 16
- 26
1
vote
2 answers
In Angular 8 which one is best preferable way for DOM manipulation
Currently I am learning Angular 8 and I have found that in few articles people are using below kind of code to get html DOM element.
import {AfterViewInit, Component, ElementRef, ViewChild} from '@angular/core';
@Component({
selector: 'app',
…
Moon
- 4,014
- 3
- 30
- 66