Questions tagged [angular2-directives]

Use for questions about Angular 2+ directives

1806 questions
19
votes
9 answers

Angular 2 Focus on first invalid input after Click/Event

I have an odd requirement and was hoping for some help. I need to focus on the first found invalid input of a form after clicking a button (not submit). The form is rather large, and so the screen needs to scroll to the first invalid input. This…
19
votes
4 answers

Check if user has scrolled to the bottom in Angular 2

What is the best practice to check if user has scrolled to the bottom of the page in Angular2 without jQuery? Do I have access to the window in my app component? If not should i check for scrolling to the bottom of the footer component, and how…
C. Kearns
  • 1,531
  • 3
  • 13
  • 18
18
votes
3 answers

Pass parameter to Angular 4 directive on input

I have an input text field like this and my directive is: import { Directive, Input, HostListener } from '@angular/core'; @Directive({ selector:…
TSG
  • 4,242
  • 9
  • 61
  • 121
18
votes
2 answers

Directive that works as ng-if (Angular 2)

I'm trying to create a directive that works as a ngIf to control if the user with the correct permission is allow to see specific content, something like this:
Daniel Soublett
  • 849
  • 2
  • 8
  • 23
18
votes
7 answers

How to import jQuery to Angular2 TypeScript projects?

I want to wrap some jQuery code in an Angular2 directive. I installed jQuery library for Typings into my project with the following command: typings install dt~jquery --save --global So now i have jquery folder under typings/global folder in my…
smartmouse
  • 13,912
  • 34
  • 100
  • 166
18
votes
1 answer

Component as Injectable?

I am trying to build my own Modal component, that I would be able to reuse throughout my Angular2 Apps. I am considering different approaches, and I am wondering if it is possible to create @Component that also serves as @Injectable? I am…
alegrowski
  • 261
  • 2
  • 3
  • 8
18
votes
1 answer

How to create a link to external URL in Angular 2

I am new to Angular. I am starting with ver. 2. I need to link to a file://... URL. I tried normal href: Note: app is a model object of the web which deals with applications. no link…
18
votes
1 answer

Globally register a directive in Angular

I am developing an Angular application. I need to add special behavior to all links. In AngularJS would just write a directive like this: angular.module('whatever.module', []).directive('href', function() { return { restrict: 'A', …
kamilkp
  • 9,690
  • 6
  • 37
  • 56
17
votes
2 answers

Generic type 'Array' requires 1 type argument(s). - Angular2

I have been trying to implement a simple ngFor with Angular2 but I don't know what went wrong which lead to error 'Generic TYpe Array requires one argument(s). PLease favour import { Component } from '@angular/core'; @Component({ …
17
votes
2 answers

Building a wrapper directive (wrap some content / component) in angular2

I'm pretty new building directives with Angular2. What I want is to create a popup directive that will wrap the content with some css classes. Content Content can be pure text and headers like:

Header

Content to…
Mikkel
  • 1,771
  • 11
  • 35
  • 59
17
votes
2 answers

Difference between Renderer and ElementRef in angular 2

What is the difference between Renderer and ElementRef? In Angular both are used for DOM Manipulation. I am currently using ElementRef alone for writing Angular 2 directives. If I get more info about Renderer, I can use that in my future…
16
votes
4 answers

directive click outside angular 6

I upgraded my Angular from 4 to 6, and consequently had a problem with my click-off policy, it stopped working on all components. my directive: import { Directive, Output, EventEmitter, ElementRef, HostListener } from '@angular/core'; …
André Montório
  • 311
  • 1
  • 4
  • 14
16
votes
2 answers

Angular2 - ViewChild from a Directive

I have a component with the name EasyBoxComponent, and a @Directive with this @Viewchild: @ViewChild(EasyBoxComponent) myComponent: EasyBoxComponent; I thought this was the correct syntax, but this.myComponent is always undefined. Here's the whole…
Michalis
  • 6,686
  • 13
  • 52
  • 78
16
votes
2 answers

Passing context to template through ngOutletContext in Angular2

I have a component to which I am passing a template. Inside of this component I would like to pass context so that I could display data. @Component({ selector: 'my-component', providers: [], template: `