Questions tagged [angular-decorator]
The angular-decorator tag has no usage guidance, but it has a tag wiki.
121
questions
1
vote
0
answers
18
views
Angular: custom decorator to override behavior of built-in ViewChild
I am trying to write a "shorthand" decorator/annotation to use instead of @ViewChild, by overriding its default behavior with {static: true} (I am migrating an Angular 4 app to 13, which has ...
0
votes
0
answers
19
views
Calling Fuction After Decorator With different type in Decorator and in component
This may be a silly question but here it is going.
I was trying to create an Experimental Decorator in Angular with TypeScript that when you run function it will send an Ajax Request with decarator ...
1
vote
2
answers
70
views
The correct way to use decorators when logging services in Angular
I have two services one is an Auth service and the other is an Analytics service and they exist in different libraries. The analytics service is used to do event logging. One obvious way I could use ...
1
vote
1
answer
43
views
Error: Expected "styleUrls" to be an array of String
Getting this error when I am using dynamic styleUrls.
var dynamic = environment.booleanCondition ? '-new' : '';
@Component({
selector: 'app-some-thing',
templateUrl: './some-thing.component.html',...
0
votes
0
answers
24
views
Javascript decorator that handles unhandled promise rejection
can someone share a way to build a decorator, which will wrap each method of a class with try-catch block, so all method errors are handled the same way while decreasing the amount of code boilerplate?...
0
votes
1
answer
16
views
How can i pass the function for a on click event at the component?
Component1 code. I want to pass to this component the name of the function that run at the click in the link.
`<a [routerLink]="linkTo" class="nav-link" (click)="...
0
votes
1
answer
153
views
How to disable typing but allow copy and paste in a text box in Angular 8?
I want to restrict typing in a text box but I need to paste anything inside that textbox in Angular
0
votes
1
answer
120
views
Base class for component with a decorated method is not being picked up in the component that inherits from it
I'm using this code in my component to have a confirmation before the user refreshes the page, to avoid losing changes by mistake:
@HostListener('window:beforeunload', ['$event'])
...
0
votes
2
answers
120
views
Emit an event dynamically in angular
I am trying to create a child component where I want to emit an event to the parent based on some condition.
For simplicity's sake, let's say that I have a child component and will take an input(...
0
votes
2
answers
32
views
How can I get public variable value inside @input decorator of type function?
I have a dropdown component which has @Input decoration having function with arguments and it returns boolean value
dropdown-abstract.component.ts
@Input() public itemDisabled: (itemArgs: { ...
1
vote
0
answers
48
views
tyepscript set type of 'this' on function decorator
I have a decorator that create a proxy over properties and whenever that property is changed to something new, it will let you do some side effect to happen
class A{
@OnChange<number>(...
0
votes
2
answers
427
views
Angular manually set @Input value is still overwritten with the same value in ngOnChanges
I have a parent component employees.component.ts and a child component employee.component.ts. The parent's template is divided into two parts - 20% of the width is a PrimeNG tree component (its nodes ...
0
votes
1
answer
68
views
Directive not working for non numeric values
I have directive to forbid entering non-numeric symbols in input
Here is directive
import { NgControl } from "@angular/forms";
import { HostListener, Directive } from "@angular/core&...
0
votes
1
answer
353
views
getting a cannot read properties on undefined when calling render Rows error on ng mat-table
Working with Angular and Angular Material in VS 2019. In the code below I have excluded a lot of code but hope all relevant/pertinent code is present.
I am getting the following error when the code ...
0
votes
0
answers
59
views
Mock third party services in Angular to run on development mode
Let's say I have a 3rd party Authentication service. I would like to mock it so that I can enter some random username and password to bypass authentication in development mode.
In AngularJs, I can use ...
0
votes
1
answer
63
views
How to change type of property via docorators
I have an angular component like this:
import { Component, OnInit } from "@angular/core";
function ConvertToBoolean<T extends object, K extends keyof T>() {
return (target: Object, ...
0
votes
1
answer
109
views
Angular promise handling decorator on an async method
I have a lot of places in my app where failed async method calls need to be treated in the same way: showing a toaster and logging the error in the console. For this purpose I'm writing a decorator ...
0
votes
1
answer
624
views
TypeScript - property decorator as type guard
I would like to know if it's possible in TypeScript to use a property decorator as a type guard in order ensure that the property is not null | undefined.
Let's assume having the following example.
...
1
vote
1
answer
159
views
Use-case of ViewChild decorator with selector as any provider defined in the child component tree of the current component
In Angular ViewChild Documentation , it is mentioned that:
The following selectors are supported:
Any provider defined in the child component tree of the current component (e.g. @ViewChild(...
2
votes
1
answer
985
views
What is @SkipSelf decorator in Angular?
The @SkipSelf decorator tells DI to look for a dependency in the whole tree starting from the parent injector
I came across the @SkipSelf decorator as below. What does this @SkipSelfdecorator exactly ...
0
votes
5
answers
416
views
Trying to pass object from api to child component using Input Decorator
I have a parent component that receives data from an api using a service. I need to pass this data to the child component, as I don't want to make another call to the api (strict rule). I can access ...
0
votes
0
answers
380
views
custom class decorator s in Angular - Understanding of mentioned code
I got the following code from internet for implementing auto unsubscribing from internet:
@Component({...})
export class AppComponent implements OnInit, OnDestroy {
notifier = new Subject()
...
0
votes
2
answers
373
views
How to set @Input variable as an optional in angular 5?
I want to set @Input parameters optional.
For example:
Child1.html:
templateUrl:'common-html.html'
Child1.TS:
currentValue : boolean = true;
CASE 2:
Child2.html:
templateUrl:'common-html.html'
...
1
vote
2
answers
1k
views
Why @ViewChild() decorator is not working in this Angular component using PrimeNG FullCalendar?
I am finding the following problem working on a simple Angular 9 project that uses PrimeNG FullCalendar component, this one:
https://primefaces.org/primeng/showcase/#/fullcalendar
This PrimeNG ...
0
votes
0
answers
110
views
Angular decorators issue
I have a component in two different projects (project A, Project B), but only works as expected in project A
the following code corresponds to the same block of code for the component
project A
...
1
vote
0
answers
150
views
Ionic/Angular: How to bind an input decorator to a form control value?
In my app I have a component (search page) that has a sub-component (search field) which has an input field. On another pages I do a router navigation to that component with query parameters: search?q=...
2
votes
1
answer
468
views
Error using spyOn in a @ViewChild variable
I have a component that uses
@ViewChild(NgbDropdown) public dropdown: NgbDropdown;
this.dropdown.isOpen();
In my spec file, I need to mock the isOpen() result to true but I can't seem to spy on it.
...
-1
votes
1
answer
410
views
Class is not binded to host element using HostBinding
I am trying to bind a class using host binding in Angular but something is going wrong
app.component.ts
import { Component, HostBinding } from '@angular/core';
@Component({
selector: 'my-...
0
votes
1
answer
517
views
How to add and declare new property to class using decorator in typescript (angular)
I'm trying to add new property to class using decorator. Here is my code
function classDecorator<T extends {new(...args: any[]): {}}>(constructor: T) {
constructor.prototype.newProperty = '...
4
votes
3
answers
6k
views
What is the difference between a Decorator and Directive in angular?
I am so confused about Directives and Decorators in Angular. I thought anything prefixed with @ is a Decorator and now when i read about Directives it says, Component is a Directive. What's going on? ...
0
votes
2
answers
3k
views
Pass data from parent component to child component using @input decorator in angular 8
Hello i want to pass a number from component to another and i'm using @input.
Here my parent component :
@Component({
selector: 'inter-asp',
styleUrls: [('./asp.component.scss')],
...
-2
votes
1
answer
98
views
Why @Input and @Output decorators declared inside class? Why not outside class like @Component? [closed]
Can anybody explain why @Input and @output decorators declared inside the class, can't we declare it outside the class like @Component?
import { Component, Input } from '@angular/core';
@Component({...
0
votes
2
answers
1k
views
Angular @ViewChild not loading on Router Outlet load
I have the below screen with 4 buttons I am using to complete a tutorial on passing data between components (Sharing Data Between Angular Components - Four Methods).
I am having trouble with the @...
0
votes
1
answer
393
views
Modify @Input array and copy to local array in Angular 4
Array from parent component-A to child component-B, In component-B I want to remove some entries and copy to a local array in component-B
In app-compa.ts:
User=[{id:1,name:"ABC"}{id:1,name:"XYZ"}{id:...
3
votes
0
answers
347
views
How to get ViewContainerRef from a subset of @ViewChildren filtered by Directive (FormControlName)?
I'm trying to add a custom directive to the form tag and then get the inputs that use the directive formControlName to filter them by formControl and then add the mat error component dynamically to it....
0
votes
1
answer
747
views
Problem with @Input property change an Angular 6
I have a problem where I am trying to implement an accordion using angular and css only with expand all and collapse all. Expand All/ Collapse All links are in parent component where as the accordions ...
1
vote
2
answers
2k
views
Property Decorators in Angular Model
I have an Angular 8 application that retrieves some data from the backend and displays it on the front end. I have a problem that the backend model and the frontend model is not exactly the same, for ...
1
vote
0
answers
447
views
@ViewChild is undefined in Angular 6 Inheritance
Im using angular 6 to implement below example. When do this way ended up with Undefined Error while using @ViewChild in parent. Here is the code snippet,
Base Component
@Component({
selector: '...
0
votes
1
answer
712
views
Calling parent method from child component not working with callback
I have one situation and i am not sure what is happening, so basically i have two components: parent and child, and my structure looks like this:
in parent component i have some data that is shown on ...
0
votes
1
answer
42
views
which one give better performance and correct way to bind @Input in angular?
i can use three Input attributes as like below
<sample-component [attr1]="value1" [attr2]="value2" [attr3]="value3"></sample-component>
or
<sample-component [combinedAttr]="...
6
votes
0
answers
1k
views
Angular: How can I access the property `selector` from the `Component` decorator inside the Component?
What I want (pseudocode):
@Component({
selector: 'app-some-component',
....
})
export class SomeComponentComponent {
constructor() {
console.log(@COMPONENT.SELECTOR); // logs 'app-...
2
votes
1
answer
3k
views
Pass aditional arguments to method decorator inside angular component
Let's say we have a lot of method's where we want to add a confirmation dialog to the original method. Therefor we decide to build a custom decorator.
@Component({...})
export class HeroComponent {
...
0
votes
0
answers
53
views
differenche between Inject Parent component and use @Input() in Angular
Hi which is the difference between Inject the parent component into the child componet and use the @Input() decorator? Is there any performance difference?
PARENT
@Component({
selector: 'a-comp',
...
1
vote
0
answers
68
views
@Input/@Output check in templates
Is it possible to somehow check in Angular project templates, if there is a @Input/@Output defined in template, but not defined in class files? This is what happened recently in our team project: Our ...
1
vote
2
answers
55
views
Angular 6 decorators - Can someone please demystify decorators ? How it works, In which case to use
I am learning angular 6. There is something I am trying to understand, but still cannot fully understand. It is decorator. Decorator
can be use on classes, method, variable, ... I have read multiple ...
8
votes
3
answers
3k
views
@ContentChildren not picking up items inside custom component
I'm trying to use @ContentChildren to pick up all items with the #buttonItem tag.
@ContentChildren('buttonItem', { descendants: true })
This works when we have the ref item directly in the parent ...
0
votes
2
answers
1k
views
ERROR TypeError: Cannot read property 'seatsavailable' of undefined
I'm working in Angular 6 project with @Input and @Output decorators. I have Bookride Component as a parent component and RideDetails as a child component.
I could successfully pass the data from my ...
4
votes
1
answer
413
views
Angular 6: HostListener decorator broken by production build
My application registers hotkey listeners to allow the user to perform actions with the keyboard only. Here's an example:
@HostListener('document:keydown.meta.a', ['$event'])
selectAllHotkey(...
2
votes
0
answers
1k
views
How to extend angular @input decorator?
I'm trying to write custom property decorator for extending skills of angular @Input decorator.
My goal is to get Localizable property with existing property selector.
./decorators/my-decorators.ts
...
1
vote
2
answers
296
views
How to intercept convenience shortcuts of $http in AngularJS
I have the following function (credit) that wraps an AngularJS $http function in a way that it invokes browser XHR when running on desktop, but invokes cordova-plugin-advanced-http if on mobile.
It ...