37 questions
1
vote
2
answers
40
views
Using generic typescript instead of #-Links wth angular bootstrap
I'm interested in using bootstrap for ui development. But I'm not sure if, what I try to do is achievable. Imagine that I want wanting some Dropdowns Like this one of the bootstrap examples:
<div ...
- 1,269
1
vote
1
answer
320
views
TemplateRef in Angular 18 missing context
What am I missing here? The template seems to render but the context is empty, resulting in just an empty button being displayed. Written with Angular 18.
import { AfterViewInit, Component, ElementRef,...
- 21
2
votes
2
answers
1k
views
Updating a template using signals within a @for loop is not working
I have been trying and experimenting with a load of different approaches, but I cannot seem to get it working that my template gets updated.
Currently the situation: I have an Angular 19 app, ...
- 45
1
vote
1
answer
73
views
How to use unique reference in a loop
With Angular I am using this date time picker in loop and I need to assign a unique reference. So far I hardcode it to req_d1 but it creates some problem. I would like to know how could I set a ...
- 1,286
2
votes
2
answers
119
views
Not able to define same template variable twice in the angular template
I have a query regarding the template variable in angular. Actually I was trying to access multiple elements with the help of the @ViewChildren() decorator.
But when I was defining two element with ...
- 85
1
vote
1
answer
555
views
passing data between ng-template to ng-content (Angular 17)
How to pass lists$ from list.component to ng-template
im provided code you could see the pipeline of function calls and how the ng-template passes to modal.compoent.html.
.................................
- 35
0
votes
0
answers
33
views
Display Html element according to a template variable
An HTML template of my application has 3 div
Each of these divs has a specific template variable.
Let’s assume the following code:
<div class="container">
<div #variable1>Some ...
- 445
4
votes
2
answers
3k
views
How to update the styles of @ViewChildren (Or @ContentChildren) in Angular(v14)
I'm trying to create a carousel component that has n amount of child components based on whatever size list it will get. I want the parent (carousel) to control the styling for children as it ...
- 90
3
votes
1
answer
3k
views
How to create template reference inside the `ngFor` loop with angular?
i am trying to create template reference through ngFor loop. but not works.
ts file:
import { Component, VERSION } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app....
- 15.5k
-1
votes
1
answer
54
views
Rewrite angular directive which uses template variables
I've written a structural directive which sets the itemTemplate on my custom Select2Component
@Directive({ selector: '[bsItemTemplate]' })
export class BsItemTemplateDirective {
constructor(private ...
- 3,709
0
votes
1
answer
1k
views
angular ViewChild isnt working inside a ngIf statement
I am trying to show student data in a table according to a selected course
in my app.componenet.html:
<div class="column">
<app-courses-list #child></app-courses-list&...
- 27
0
votes
1
answer
40
views
Angular list grouped by initial letters OR re-assign variable in template problem
In Angular I have a long list of words which I display in template as <li> using *ngFor loop.
Because the list is so long, I want to make sections by initial letter. The list is already sorted ...
- 393
-1
votes
1
answer
403
views
How can I get access to a template generated local variable to component code?
Maybe I'm thinking in the completely wrong direction. But what I would like to do is call the value of a variable, which was defined in the template, in the component.
<button (click)="...
- 1,102
0
votes
1
answer
646
views
How can I bind multiple actions to a single Angular output?
How can I bind multiple actions to a single Angular output, without creating any additional methods?
An example would be updating the value of a formControl based on an output from a custom component ...
- 4,116
1
vote
0
answers
341
views
How to getting a reference to elements within the container of an angular structural directive
I have the following template with a test structural directive called *appUnless:
<h1 *appUnless>
<app-hello></app-hello>
<input type="text" value="hello" /...
- 3,407
2
votes
1
answer
1k
views
Angular ngIf: Identifier 'length' is not defined
My component has the property transfers$ that is an observable that can comes with an array or an object that contains the error message.
I can only input [items] when transfers$ is Transfer[]. But ...
- 149
0
votes
2
answers
2k
views
Add template reference variable attribute to element if first Angular
I have a mega nav menu that is made by looping through a JSON response from server. I want to add a #first template reference variable to the first a tag. (This is so that I can access it from its ...
- 7,341
3
votes
1
answer
5k
views
Angular: how do I access the reference variable which is in a ng-template
Is there a way to access #interface, which is declared inside ng-template element?
I must put the <interface-settings inside <ng-template.
Because I would need to use the *ngTemplateOutlet.
As I ...
- 1,359
0
votes
0
answers
312
views
Expression has changed after it was checked - ngTemplateOutletContext
I'm using angular v9.
I'm creating a component and the parameters is a list of items and a callback, in ngOnInit, i call the function group and i reduce the items parameter, and every item, i call the ...
1
vote
1
answer
284
views
What is wrong with Angular's logical OR in option attribute? When [(ngModel)] is used in select the [selected] attribute doesn't affect the selection
I have an option in select like this:
<option [selected]=" impulse === 10 || isTraining " value="10">10</option>
When I have any possible value of impulse and isTraining is true my ...
- 5,413
0
votes
1
answer
274
views
Angular 2+ NgOnInit assigning value to input array but throws an error of undefined
I have a component which expects some inputs, the input that i care about is the feedList. In the feedList there are feed objects with their own data filled in. However, depending on the feed ...
- 940
1
vote
0
answers
2k
views
change content of <ng-template> programmatically from a component
EDITED
i got reference to a by a template variable in its component.
<ng-template #templateLogGroup>Logs Group</ng-template>
@ViewChild('templateLogGroup') templateLogGroup : ...
- 2,254
0
votes
3
answers
171
views
How to refer a funtion as a template variable in Ionic Angular app?
I have an Order object and a Customer Object. The JSON payload for the Order object is like the following:
{
"order_number" : 1,
"customer_id": 1
}
And this is the JSON payload for the Customer ...
- 427
0
votes
1
answer
1k
views
Angular form *ngfor with template variable and two way binding
I have looked into several posts with this kind of problem but did not find a solution.
description:
Everything is shown with the last object value "profession" on init (model.overview : IOverview)
...
- 652
1
vote
1
answer
58
views
What is the cost of watching a template reference value in Angular
Currently using Angular 8, ended up with a code like this.
<div [style.height.px]="dynamicHeightComponent.offsetHeight">
</div>
<div #dynamicHeightComponent>
...
</div>
Is ...
- 329
5
votes
1
answer
4k
views
Get the ElementRef from the Template reference variable in Angular [duplicate]
In the following code
<input #myRef1 />
<input #myRef2 my-custom-attribute />
The #myRef1 will be an ElementRef, and #myRef2 will be MyCustomAttributeComponent directive. Basically, it ...
- 4,047
2
votes
1
answer
393
views
Angular *ngIf="data$ async as data && data.payload; else noContent"
I want to conditionally show a block only if it contains data, otherwise I will show a noContent block.
the data is fetched from the server.
<ng-container *ngIf="data$ async as data && ...
- 634
0
votes
1
answer
434
views
Surplus space between the variable and dot in Angular, how can I clean up it?
I have a condition block with ng-container in my Angular html template. The rendered html contains unexplained space for me, how can I work it around?
The template part:
<...
- 5,413
11
votes
1
answer
5k
views
ngFor - Can't bind to 'testid' since it isn't a known property of 'input'. how to concat id with string?
I am trying to add the index value with my ids. but getting an error as:
Can't bind to 'testid' since it isn't a known property of 'input'.
here is my template:
<td *ngFor="let col of columns; ...
- 15.5k
1
vote
3
answers
2k
views
Angular: radio button [checked] not set with template reference variable
As the title suggests, I have a scenario where, if the "Select All" radio button is checked, it must check all of the radio buttons in the columns below. Unfortunately, this is not working.
Here is ...
- 7,873
10
votes
5
answers
18k
views
Assign a value to a variable in the template - Angular7
There are toggle two button (edit and submit), which button should work like toggle show/hide style on click
<button (click)="showEditBtn = false;" *ngIf="showEditBtn;"> Edit</button>
<...
- 6,676
1
vote
3
answers
5k
views
How to convert string to an template reference instance?
I'm setting up ngTemplateOutlet inside *ngFor like in below code snippet
<ul>
<li *ngFor="let item of list">
<ng-container [ngTemplateOutlet]="item.type"></ng-...
4
votes
1
answer
2k
views
angular - declare result of pipe as local variable
I'm using ngx-pipe's percentage pipe twice in a label. Once to determine which color class (success or info) and once to display the percentage.
<label class="label" [ngClass]="(item.amount |
...
- 8,579
4
votes
2
answers
8k
views
Identify specific Angular TemplateRef from a QueryList
In Angular 6/7, I have a component into which I am projecting content like so (ParentComponent template):
<my-component [templateNames]="['t1', 't2']">
<ng-template name="t1">...</ng-...
- 41.1k
2
votes
0
answers
247
views
Angular custom template interpolation breaks with curly braces
I'm new with Angular and I can not find and answer to my question.
I want to change the Angular interpolation to make it compatible with Smarty templates, so I changed the default ['{{','}}'] to ['[['...
- 85
6
votes
4
answers
7k
views
Angular reference # vs ngModel
I wonder when do I have to use [(ngModel)] on my input and when I can just use #reference
For example
<div class="form-group">
<div class="input-group mb-2">
<input type="text" ...
-2
votes
1
answer
204
views
Angular 2+ update template values using pipe
I am writing a checkout view of a shopping cart where an array is displayed with the items to be purchased like this:
app.component.html
<div *ngFor="let x of shoppingarray">
<!-- ...
- 119