Questions tagged [angular-components]

A component controls a patch of screen called a view. Component decorator allows you to mark a class as an Angular component and provide additional metadata that determines how the component should be processed, instantiated and used at run time.

Components are the most basic building block of an UI in an Angular application. An Angular application is a tree of Angular components. Angular components are a subset of directives. Unlike directives, components always have a template and only one component can be instantiated per an element in a template.You can see more information on components here

2024 questions
9
votes
5 answers

How to inject SVG icon sprites in Angular component HTML DOM?

I am building an Angular application (Angular 4/5/6) and would like to use SVG sprites in my component template. Question: Assuming I already have my SVG icon sprite generated (icons.svg), how can I get Angular to inject/import my SVG icon sprite…
Zythyr
  • 1,142
  • 4
  • 20
  • 33
9
votes
3 answers

Handle Model Change in Angular 5 Component (Two-way-binding)

I'm currently working on an angular 5 application. I try to alter a member variable of my component in an input on the view and use the variable in my component after the change. My structure is as follows: Folder: my-test my-test.component.html…
TimHorton
  • 865
  • 3
  • 13
  • 33
9
votes
2 answers

How to reuse all imports in Angular test files

Lets say I have a simple module AppModule which has many imports, declarations and providers. Now I want to write a test for a component ListComponent which is located in this module's declaration list. ListComponent itself uses many, (but not…
9
votes
2 answers

Does ViewContainerRef.clear() remove component from memory?

When I create a component using ViewContainerRef and assign instance to a property of parent component, which is responsible for child component creation, do I need to set this property to null after I call ViewContainerRef.clear() if I want memory…
Leonid Bor
  • 2,064
  • 6
  • 27
  • 47
9
votes
3 answers

Multiple instance of angular 4 directive called from a component mesed up the input values

I have a component in angular 4 that is called three times. In template metadata I have a div with a directive with some bindings like this. @import {gServ} from '../gServ.service'; @Component: ({ selector: 'sr-comp', template: `
xzegga
  • 3,051
  • 3
  • 25
  • 45
8
votes
1 answer

Angular Nebular styles does not apply for NbChatComponent

I have an ongoing angular project and I'm trying to add Nebular Chat UI to the project. I installed nebular with npm and did the imports as mentioned in the site. Functionality is working as expected, but the styles are not applied to the…
8
votes
6 answers

Angular 6 Data Sharing Service Subscribe not triggered

I need to set Value in One Component (Component A) and Receive the Value in another Component (Component B). Component A and Component B are not Parent and Child. I created a Shared Service to Share data between the 2 components. I'm able to set…
Anirudh
  • 2,767
  • 5
  • 69
  • 119
8
votes
2 answers

Angular 5 Update Parent Component value from child Component

Child Component TS import { Component, OnInit, Input, Output } from '@angular/core'; import { EventEmitter } from 'events'; export class ChildComponent implements OnInit { @Output() OpenScheduleCall = new EventEmitter(); onLog()…
Mohammad Fareed
  • 1,927
  • 6
  • 26
  • 59
8
votes
4 answers

How to execute a function from another component that is NOT a sibling of the first component?

I'm trying to execute a function from another component (These 2 components are NOT siblings). My guess is that I will need to use @Output and eventEmitter to accomplish this or create a Service and subscribe to the Observable to share the same data…
HenryDev
  • 4,685
  • 5
  • 27
  • 64
8
votes
6 answers

Angular 4 - Pass an object from one component to another (no parent - child hierarchy)

My situation: I have a component showing tiles with each tile representing an object from an array that is looped over with an ngfor. When a tile is clicked I want to pass the object to a different component, which is responsable for displaying all…
Dennis
  • 818
  • 2
  • 10
  • 23
8
votes
1 answer

Why use ViewContainerRef over *ngif?

I could just do But every document on inserting component in dom dynamically is based on ViewContainerRef. I like what it does. But what makes it so special over…
8
votes
4 answers

Angular @Output not working

Trying to do child to parent communication with @Output event emitter but is no working here is the child component import { Component, OnInit, Output, Input, EventEmitter } from '@angular/core'; @Component({ selector: 'app-emiter', …
shark6552
  • 101
  • 1
  • 2
  • 12
8
votes
2 answers

Angular - Component different templates

I have a component "course". I use this component to a list. This list sometimes is horizontal and some times is vertical. Can I choose dynamicaly inside the component the template file? @Component({ selector: 'course', templateUrl:…
Michalis
  • 6,686
  • 13
  • 52
  • 78
8
votes
2 answers

Apply attribute directive on component in Angular 4

I have created img-pop component which has @Input() bind property src. I have created authSrc directive which has @HostBinding() property src. @Component({ selector: 'img-pop', template: `
8
votes
2 answers

AngularJS - Pass Value to Component

I am trying to pass a value from one component into another component. Location List

This is from location list:…

alexdriedger
  • 2,884
  • 2
  • 23
  • 30