Questions tagged [angularjs-directive]
AngularJS directives are a way to teach HTML new tricks by extending the HTML vocabulary. Directives allow you to manage DOM elements in a declarative pattern, freeing you from low level DOM manipulation tasks.
17,538
questions
0
votes
2
answers
32
views
How to pass and use extras in navigateByUrl() in angular 11?
I am passing data with navigateByUrl method and want to access this inside the target components ngOnInit().
this._router.navigateByUrl(${baseUrl}?${previousFilter}, { state: {from:'details-page'} });
...
0
votes
0
answers
18
views
Bind scope function to output event in angular hybrid application
I am using angular hybrid application. I have a directive created in angular js. It has a scope method called onUpdateStatusCompleted. The directive has an angular js component inside it.
The link ...
0
votes
1
answer
34
views
Prevent div in flexbox from changing width with additional content
Hi I have this web page where I have a list of angular.js directive elements that are strucured in a flexbox.
The directive elements look something like this:
<div class="variable-input-...
0
votes
1
answer
33
views
Contenteditable doesn't work for span element in firefox
Hi I'm currently working on implementing a custom input directive for our web application.
Now my input element is constructed like this:
<div class="variable-input-container" style="...
0
votes
1
answer
42
views
How to create a good delete method to remove one record from table using angular?
I was trying to create a method to delete an employee by its id, so I created multiple logic and all of them gives me an error in the vs code except this method.
It gives me an error on the console ...
0
votes
2
answers
42
views
'SubConstructor' is assignable to the constraint of type 'B', but 'B' could be instantiated with a different subtype of constraint 'BaseConstructor'
I am new to generics I made a design where we use generic so that it increases code flexiblity. But in my case I have a weird issue where the get the above error. My requirement is that I want to able ...
1
vote
1
answer
38
views
why it not navigate to the dashboard page after login
id: any;
loginsubmit(id: any) {
console.log("button works");
const che = \[\];
this.admincreation.getdatas(id).subscribe((che: any) =\> {
{
const adminl = che.find((b: any) =\> {
...
0
votes
0
answers
24
views
npm ERR! peer @angular/compiler@"6.0.8" from @angular/[email protected] npm ERR! node_modules/@angular/compiler-cli
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @angular/[email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/...
0
votes
0
answers
49
views
Angular ssr : (click) from html is not working
in my HTML i have simple click event that call to my typescript file.
This code is very simple for client side application however if I try the implement is SSR this code is not working .
Not able ...
0
votes
1
answer
29
views
'appMySortGrid' since it isn't a known property of 'div' for @directive is not working in angular project
I have created a new directive in angular Project for drag and drop functionality also declared in app.module.ts here is the my error
src/app/modules/xyz.component.html:29:54 - error NG8002: Can't ...
0
votes
0
answers
19
views
Which angular tilt package to use with Angular 15?
I have found that @geometricpanda/[email protected] is not compaitble with Angular 15.
Which angular tilt package to use with Angular 15?
-1
votes
1
answer
34
views
How can i pass conditional variables in custom directive Angular?
I am trying to pass variable in my custom directive. But this gets false or undefined after load. Please help me to find the issue and guide me where i am wrong.
Custom Directive
import { Directive, ...
0
votes
0
answers
19
views
Webpack React - Html Loader Issue
./legacy/src/User/UserDirective.tpl.html:1:1 - Error: Module parse failed: Unexpected token (1:1)
You may need an appropriate loader to handle this file type, currently no loaders are configured to ...
0
votes
1
answer
43
views
matTooltip not working in any routed components
Tooltip WORKS on login component which is not loaded using loadChildren but NOT WORKING on Search component. The only difference is loadChildren is used to load search component but not for login ...
0
votes
0
answers
7
views
How deleted result base64 AngularJS
What is the code to remove this in an AngularJS directive. Want me to use it for the hide button?
angular.module('app', ['uiCropper'])
.controller('Ctrl', function($scope) {
$scope.myImage='';
...
0
votes
0
answers
42
views
How to resolve Error: [$compile:multidir] Multiple directives in AngularJS
I'm facing this issue in the AngularJS the error is:
angular.min.js:13708 Error: [$compile:multidir] Multiple directives [foundItems (module: NarrowItDownApp), foundItems (module: NarrowItDownApp)] ...
0
votes
0
answers
42
views
How make automatic crop image according to maximum value in AngularJS
How do I make an automatic crop according to the maximum value that I set, for example 1080x1080 in AngularJS, so if the image is too big it will automatically be cropped to 1080x1080 and if the image ...
0
votes
0
answers
40
views
What is the alternative to display upload preview image other than base64
What is the alternative to displaying the upload preview other than base64 so that it doesn't become heavy when the link is opened like facebook, I have 2 examples found between AngularJS and ...
0
votes
0
answers
18
views
Compiled with problems: × ERROR - error TS2532: Object is possibly 'undefined'
I want to use nativeElement in ngOnInit but i can't able to use in lifecycle. It throws an error.
import { Directive, ElementRef, OnInit } from "@angular/core";
@Directive({
selector: '\...
0
votes
0
answers
29
views
How to call a route which is present in different MFE in Angular 12
I am having 2 MFEs A & B which have been created in angular 12 and running at different ports. They are connected through a shell app. I need to create a page which shows some data from MFE A and ...
0
votes
0
answers
223
views
polyfills.js:1 [webpack-dev-server] Server started: Hot Module Replacement disabled, Live Reloading enabled, Progress disabled, Overlay enabled
If i edit something in the webpage at that time angular application goes into infinite page load process for some mini, can any one help me with this issue.
I was updating my angular project from 15 ...
0
votes
0
answers
12
views
How to make auto size for textarea in Angularjs
I found the following code to make the height of the textarea automatically when there is text, I have confusion when entering the code into the code I have
Below is the code I found
<textarea auto-...
0
votes
0
answers
54
views
Generating browser application bundles (phase: setup)...An unhandled exception occurred: Cannot find module '@angular/cli/utilities/find-up'
I Upgraded angular microfrontened from 8 to 14.After serving getting error as Generating browser application bundles (phase: setup)...An unhandled exception occurred: Cannot find module '@angular/cli/...
1
vote
1
answer
80
views
Tab crashes when using window MutationObserver with Angular HostBinding
I encountered a very weird bug when adding a MutationObserver to my application.
One of my Angular components is using HostBinding to the attr.style attribute of the element, this was working fine ...
1
vote
0
answers
55
views
Angular drag-and-drop directive adds characters to file extension
There is a usual drag-and-drop directive in Angular. Everything works well, but it doesn't always work.
Sometimes in evt.dataTransfer.files[0]?.name comes either undefined or a changed file extension, ...
1
vote
0
answers
30
views
Want to change background color of cell based on value of variable in mat table angular
I am using angular material and in that using mat-table.
Now I want to change background color of cell based on value of variable.
So if value is >50 then it should show yellow color OR show green ...
3
votes
1
answer
62
views
What do so many colons do in Angular *ngIf expression?
For example:
*ngIf="step?.salaryChangedBy?.updated | issalaryUpdated : lastViewedByUser : step?.salaryChangedBy?.userId : userId"
Or the formatted one is more readable:
*ngIf="
...
0
votes
0
answers
19
views
How to set the timezone to mat-date-picker to highlight the today indicator according to provided Timezone
I have in-app timezone functionality. in Angular mat date-picker the circle that highlights the today day in a circle is from the system timezone I want that circle to be from provided timezone
0
votes
0
answers
7
views
Found ERROR when run ng-serve when i am installing node module in existing project
I am encountering a problem when I run ng serve
An unhandled exception occurred: Cannot find module 'webpack'
Require stack:
C:\Users\Muhammad Waqas\Desktop\my project\default\node_modules@angular-...
0
votes
1
answer
315
views
Angular animation to smooth collapse/expand *ngIf content of variable height
I want to create an Angular animation that smoothly expands/collapses containers when that container's content is added/removed from the DOM.
(This is an easy CSS fix if the content never leaves the ...
0
votes
1
answer
82
views
(Angular) Karma Jasmine test is showing failure for a working feature
I'm trying to write a unit test for a directive that is supposed to open a popup when it's clicked.
The directive works perfectly when i test it manually, however, the unit test shows failure which I ...
0
votes
1
answer
35
views
Angular -Binding Error: Can't bind to 'ngIf'
I have tried to solve this issue without having success.
It's strange becuase this the module that return teh issue is the replica of another one that works fine.
I have shared the folder on gitHub - ...
0
votes
0
answers
201
views
PrimeNG Calendar showing plus icon instead of next icon
I am using PrimeNG Calendar in my web application, and I have encountered an issue where the calendar displays a plus icon instead of the expected next icon.
Class and icon used by component >
...
0
votes
0
answers
38
views
I want to disabled (click) event on mouse enter and reactive it on mouse leave in Angular
Goal : is abled execution of addTask function when directive found isSelecting true
i have a directive called appSelectable i want to disabled addTask on mouse eventer and isSelecting is true in the ...
0
votes
0
answers
20
views
I'm building an Angular application where I need to dynamically load different components based on user input
For example, let's say I have a dropdown menu with options A, B, and C. When the user selects an option, I want to load and display the corresponding component dynamically without reloading the entire ...
0
votes
0
answers
44
views
How to make main view component aware of changes happening to app component variable?
When there is no connection between app component and main view component, I need to make the main view component aware of the changes happening to app component variable. Below are the files
index....
1
vote
2
answers
156
views
I have problem with sending a request to api in angular with submit button
I can not sending request to api in onSubmit method
setting.service.ts
updateNumbers(number: PhoneNumbers): Observable<string> {
return this.http.put<string>(`/napi/setting/numbers/...
0
votes
0
answers
38
views
Avoid losing focus while dragging over iframe
I have the following HTML with 2 columns of content while a resizer-column is in the middle. With the drag indicator I´m able to change the relative width of those columns.
This works well unless an ...
1
vote
0
answers
34
views
Creating a Custom draggable Modal Sheet in Angualrjs
By clicking a button I am opening a custom modal sheet. Here is the code for Custom Modal sheet. What I am currently doing is that this modal pops up it has 70% height. If I click outisde of the popup ...
0
votes
1
answer
19
views
Change value of ng-model from popup windows
I have input that generates dynamically by ng-repeat. for setting the value the user should click on the button and the popup windows will open. After selecting the value, the user will click on ...
0
votes
1
answer
101
views
Can I create a component which overrides and to be able to customize mat-error?
I have created a compoenent called bl-error which contains mat-error (see code below):
this is the bl-error.component.ts:
import {Component, Input} from '@angular/core';
import {MatError} from '@...
1
vote
0
answers
93
views
angular-material-rail-drawer compatible to Angular 13
I want to use the Rail Drawer plugin in my project which is in Angular v13.
Running npm i angular-material-rail-drawer throws some errors, I tried all previous versions, but nothing works.
Is there a ...
1
vote
0
answers
509
views
How to load components dynamically without their Host Wrapper Tag
I'm loading component template during Drop Event using "createComponent()" method of ViewContainerRef class. all works okay but it loads component with it's Host Wrapper (selector) tag. but ...
3
votes
2
answers
852
views
How to insert text at current cursor position in Summernote editor in Angular 12
Description:
I have a Summernote editor (https://www.npmjs.com/package/ngx-summernote) in my Angular 12 project, and I also have a button outside the editor. When the user clicks on this button, I ...
0
votes
1
answer
18
views
Accessing attributes of an AngularJs directive
Here is the directive
(function () {
/**
* Config
*/
var moduleName = 'eBayPartsFinder.directives.searchFilters';
/**
* Module
*/
angular.module(moduleName, []).directive('searchFilters', ...
0
votes
1
answer
23
views
How to connect a directive with a controller in angularjs?
I am refactoring some angularjs with a new directive and I am trying to access a controllers scope from the directive.
Here is the directive:
(function () {
/**
* Config
*/
var ...
1
vote
1
answer
144
views
Undefined variable in component upon API call
I'm getting a lot of my variables undefined and ran at times when they shouldn't run. My best guess is that it is related to the way I make the API call.
Full code - https://fennzo-advantageapi-...
-1
votes
1
answer
17
views
I want to define the time that this function will appear
I don't know how to set the function time. I'm using Angular.
assinarApenasDespacho() { let configDialog: configDataModalDialog = { titulo: "Atenção", mensagem: "Tem certeza que deseja ...
1
vote
0
answers
157
views
Angular Calendar is not working in different timezones with daylight savings
I am using angular-calendar to show the time in week view where I can drag and drop and customize the timings. Here is the sample code below from angular calendar:-
Note that this only happening when ...
0
votes
0
answers
14
views
Display Selected Apps sticky top in MultipleSelection dropdown AngularJS
Hi ~ I have a Apps Dropdown in which user is allowed to select upto 2 Apps, I want the selected Apps to be stayed at top always whenever it is scrolled for that I need to assign top & bottom ...