Questions tagged [angular-directive]

At a high level, directives are markers on a DOM element (such as an attribute, element name, comment or CSS class) that tells the Angular 2+ framework to attach a specified behavior to that DOM element or even transform the DOM element and its children. This tag is for Angular 2+

For a comprehensive guide to what angular-directives are, see this link here

2335 questions
208
votes
10 answers

How to extend / inherit components?

I would like to create extensions for some components already deployed in Angular 2, without having to rewrite them almost completely, as the base component could undergo changes and wish these changes were also reflected in its derived…
Fernando Leal
  • 9,875
  • 4
  • 24
  • 46
185
votes
5 answers

What is an AngularJS directive?

I have spent quite a lot of time reading through AngularJS documentation and several tutorials, and I have been quite surprised at how unapproachable the documentation is. I have a simple, answerable question that may also be useful to others…
tohster
  • 6,973
  • 5
  • 38
  • 55
161
votes
5 answers

is there any alternative for ng-disabled in angular2?

I am using angular2 for development and was wondering if there is any alternative for ng-disabled in angular2. For ex. below code is in angularJS:
129
votes
10 answers

Make directive @Input required

In AngularJs we could make a directive attribute required. How do we do that in Angular with @Input? The docs don't mention it. Eg. @Component({ selector: 'my-dir', template: '
' }) export class MyComponent { @Input() a: number; //…
Simon Trewhella
  • 2,124
  • 3
  • 23
  • 23
119
votes
4 answers

How to apply multiple template bindings on one element in angular

I'm using template like following:
117
votes
5 answers

Angular why asterisk (*)

In Angular document, * and template, we know that the *ngIf, *ngSwitch, *ngFor can be expanded to ng-template tag. My question is: I think the ngIf or ngFor without * can also be translated and expanded to template tag by Angular engine. The…
maxisacoder
  • 1,709
  • 2
  • 13
  • 18
96
votes
8 answers

What is the difference between component and directive?

I have just started working with Angular 2. I was wondering what are the differences between components and directives in Angular 2?
uksz
  • 18,239
  • 30
  • 94
  • 161
81
votes
12 answers

How to access host component from directive?

Say I have the following markup: Is there any way I can access the component instance from the directive? More specifically I want to be able to access the properties and methods of MyComponent from MyDirective,…
AngularChef
  • 13,797
  • 8
  • 53
  • 69
62
votes
5 answers

Detect when input value changed in directive

I'm trying to detect when the value of an input changed in a directive. I have the following directive: import { ElementRef, Directive, Renderer} from '@angular/core'; @Directive({ selector: '[number]', host: {"(input)":…
Nate
  • 7,606
  • 23
  • 72
  • 124
59
votes
6 answers

Angular 1.5 component vs. old directive - where is a link function?

I've been reading this nice recent article about new .component() helper in Angular 1.5, which is supposed to help everyone to migrate to Angular 2 eventually. Everything looks nice and simple, but I couldn't find any information about DOM…
troorl
  • 1,579
  • 1
  • 15
  • 20
53
votes
7 answers

Get Value From Select Option in Angular 4

How do I get the value from the select option in Angular 4? I want to assign it to a new variable in the component.ts file. I've tried this but outputs nothing. Can you also do it using [(ngModel)]? component.html
Joseph
  • 7,042
  • 23
  • 83
  • 181
48
votes
10 answers

How to prevent double click in Angular?

I have a component with click. When I click this element, openModal function will run. And I'd like to give 1000ms throttle time in order to prevent opening multiple modals. My first approach was using…
Téwa
  • 1,184
  • 2
  • 13
  • 19
48
votes
4 answers

Emit event from Directive to parent element

I have an element in HTML template of an Angular 2 app. I add a directive to it:
HELLO
I want that whenever I hover over the div the text inside the div should be changed, but it needs to be done from Directive…
raju
  • 6,448
  • 24
  • 80
  • 163
47
votes
6 answers

Attribute property binding for background-image url in Angular 2

I have been struggling to figure out the best way to dynamically change the background-image attribute in a number of Angular 2 components. In the following example, I am attempting to set the background-image of a div to an @Input value using…
0xPingo
  • 2,047
  • 4
  • 19
  • 43
44
votes
4 answers

How to get element's width/height within directives and component?

@Component({ selector: '.donation', template: `
Buy me a cup of coffee.
` }) export class…
胡亚雄
  • 2,161
  • 1
  • 19
  • 21
1
2 3
99 100