Questions tagged [angular7]

0

votes
0

answer
2

Views

angular 7 how to access element by id defined in parent component from child component template

I am using primeng multiSelect control in the child component. i want this to be appended to the element defined in the parent component as shown above. the above code failed when i run npm run build:prod. it can't access popupContent in the child. can anyone help how to access the parent element in...
Mukil Deepthi
0

votes
3

answer
29

Views

How to get value from checkbox?

Following is my template: Education when user check the box ( true ) I require to get the 'Education' as value in change event. how to get that. this is required for filter purpose. On console I am not getting value: updateCategory(event){ console.log('event', event); //? }
user2024080
2

votes
1

answer
31

Views

How to prevent checkbox to be selected when click anywhere on row?

my row get selected when i click anywhere on the row even my radio button and slide toggle, i want it to be selected only when user clicks on checkbox selection: SelectionModel = new SelectionModel(true, []); @Output() approveSelectEvent: EventEmitter = new EventEmitter(); ngOnInit() { this.selectio...
HUSSAIN
1

votes
0

answer
9

Views

The selector “app-root” did not match any elements after update to Angular 7

After updating the client app of an ASP.Net Core MVC SPA-project from Angular 5.2 to Angular 7, I receive the following runtime error when loading the app from index.html: The selector 'app-root' did not match any elements at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/pl...
Marc
2

votes
0

answer
15

Views

set z-index to the auto suggestion angular mention list

I am working with Angular 7. I am facing a problem in setting the z-index to the list of the user that are coming with auto-suggestion. I am using a text box in which if I type @ then it will give suggestion for all the available users. for this functionality, I am using Angular mention directives b...
Jayesh Vyas
1

votes
1

answer
316

Views

Angular 7 relocate Assets File after Build

I have this sitemap.xml file in my assets folder under src: When building my project via the cli with ng build --prod the resulting folder looks like this: My question is simply how I can move the sitemap.xml file outside the assets folder when building my project?
Florian
1

votes
2

answer
1.4k

Views

Get previous route Angular 7

I created a little service where I can store the route changes. import { Injectable } from '@angular/core'; import { Router, NavigationEnd } from '@angular/router'; @Injectable() export class RouteState { private previousUrl: string; private currentUrl: string; constructor(private router: Router) {...
Testador
1

votes
1

answer
84

Views

Angular 7 routing doesn't work properly it refreshes the page

Here is the problem that I have: I don't want to refresh my website when I select one of the tabs in my navbar. I'm new to angular and as I understand the router should route to a page without reloading the link. My code in app-routing-module import { NgModule } from '@angular/core'; import { Routes...
Ziya Arslan
1

votes
2

answer
2.4k

Views

Return when subscribing. … Type 'Subscription' is missing the following properties

I am subscribing a response from an Angular service: books: BookModel[] = []; constructor(private bookService: BookService) { } ngOnInit() { this.books = this.getBooks(); } getBooks(): BookModel[] { return this.bookService.getByCategoryId(1).subscribe((payload: Payload) => { return payload.result.ma...
Miguel Moura
1

votes
3

answer
276

Views

Getting route param as null in angular 7

I am unable to retrive the route param as null. I am using angular7. Please find the code below HeaderComponent ts file import {Router, ActivatedRoute} from '@angular/router'; constructor(private httpService: HttpClient, private router: Router, private activatedRoute: ActivatedRoute) { this.getNewsS...
Madhavi
1

votes
4

answer
55

Views

Clicking on a button fires other button which holds same event function

I'm working on an ionic project & in my project when I click on 1 button other button also changes their values as they have same event in it. But I want opposite of that, clicking on a button should only change a particular button's value. HTML {{record.name}} {{record.id}} {{text}} TS file publ...
1

votes
2

answer
142

Views

Angular 7 : close menu when click outside

I would like to know whenever click is triggered inside parent div #menu, irrelavant of html tags exists inside it. nativeElement.parent didn't worked for me. HTML code: Toggle Menu I'm the menu. Click outside to close me Angular script: this.renderer.listen('window', 'click',(e:Event)=>{ if(e.targ...
Lavanya
1

votes
1

answer
41

Views

Angular reactive form returns empty values when fields are untouched

In my use case when the user clicks on the edit button, Angular makes an HTTP call to the backend and retrieves the object, then populates those values on EDIT form. The user can update or leave the fields untouched. When clicked update button, Angular should take all those values present in form an...
Jadda
1

votes
4

answer
32

Views

How to highlight column in table angular 6

Im trying to highlight entire column in table on hover. Can someone help me how I can achieve this in angular2+ I need exactly like the below image reference image
D C
1

votes
2

answer
69

Views

How to set dynamic value to formControl in angular 7

I have drag and drop formBuilder we can able to create form using drag and drop so now i am facing problem i have hidden field in html which is TempleteJson. Here is html code Form Name: CreatedOn: Submit Here is component.ts file formBuilder: any; formData: any; data: any; ngOnInit() { var id = thi...
Ronak Dumaniya
1

votes
2

answer
32

Views

OAuth token Unauthorized on browser

I'm using Angular 7 and I got a problem with Headers. This is my code: signin() { let signinData = this.signinForm.value; this.encoded = btoa('my-trusted-client:secret'); let header = new Headers(); header.append('Authorization', 'Basic ' + this.encoded); header.append('Content-type', 'application/x...
Ragnar Lodbrok
0

votes
0

answer
27

Views

Ionic 4 and Angular issues in --prod --release

I am trying to build the ionic 4 application with --prod --release flags. But It shows the white screen with following error, I have searched but unable to encrypt this error. The applicaiton is working fine during the ng serve and without these flags'. How to find what is 'L' Error: Cannot resolve...
Finder
0

votes
1

answer
16

Views

Error: BrowserModule has already been loaded. in MDB-Angular Lazy Loading

i am facing this problem while creating the new project on MDB angular . I have created multiple modules like public , tutor and student . public module is not lazy loaded while others are lazy loaded . public module is working perfect . import { BrowserModule } from '@angular/platform-browser'; im...
Muhammad Sohaib
1

votes
2

answer
1.1k

Views

Angular 7 Unable to include a custom typescript definition file

I created a custom typescript definition file (brat.d.ts) export declare class head { ready(callback: () => any); } export declare class Util { static embed(divId: string, collData: any, docData: any, webFontsURLs: Array); } I am importing the above definition file in Angular 7 components like this...
Amit Dube
1

votes
1

answer
151

Views

Angular - Duplicate Identifier "Input'

My component code is below import {Component, EventEmitter, OnInit, Input, Output} from '@angular/core'; import {Input} from '@angular/compiler/src/core'; @Component({ selector: 'like', templateUrl: './like.component.html', styleUrls: ['./like.component.css'] }) export class LikeComponent im...
1

votes
2

answer
124

Views

Type is not assignable to type providedIn Property ProvidedIn is missing

I am trying to create a service with the help of Angular's tutorial https://angular.io/guide/http I'm using Angular 7.0.7. The service would get json data from some url: import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; @Injectable export class ProductLis...
blue piranha
1

votes
4

answer
50

Views

Conditional on route in HTML file issue

I found this code for detecting the current route but it does not seem to work in Angular 7. Here is the code: app.component.ts import { Routes } from '@angular/router'; ... constructor(private router: Routes) {} app.component.html We are in someroute How can I check the route in the .html of a comp...
Paul Zone
1

votes
2

answer
256

Views

How to downgrade angular7 to angular6

I have tried to downgrade angular 7 to angular 6 by running the following npm commands: npm uninstall -g angular-cli npm cache clean npm install -g [email protected] However angular/cli 7 version is still displaying in my package.json file. I need help to downgrade angular7 to angular6.
SaranViji
1

votes
3

answer
132

Views

How to pass data from component to ngBootstrap modal in Angular 7?

I have a table with data displayed using ngFor. I need to display an individual row data in a modal on click. i can log it in console by passing the row as click argument but not able to pass it inside the modal. Assuming the table data is being fetched from a service and the modal is a template ref...
prawwe316
0

votes
0

answer
4

Views

Ways to integrate the Jira issue collector with an Angular app?

I'm looking to create an Angular 7 app that utilizes the Jira issue collector to submit issues directly to their respective projects. When I build the app the way it is now, nothing happens. When I move the code from method 'submitIssue' to under 'ngOnInIt' directly the issue collector dialogue come...
sgovernale
1

votes
2

answer
55

Views

store json data into array in Angular TypeScript

I am facing a problem while I am using Angular mention library. Here is my typescript code. items: Object[] = ['jay','roy','gini','rock','joy','kiya']; I am using this defined named items array in my component.html file so it is creating a text box and it is giving suggestion when I am typing any us...
Jayesh Vyas
3

votes
0

answer
38

Views

Creating dynamic forms from api response in angular7

I have created a component to create dynamic forms using angular reactive forms. When I try to use the component to create form fields in another component depending on the response from my API. The created form becomes disabled for me, I am not able to edit the form in my browser. I have used this...
Akhil Sundar
0

votes
2

answer
24

Views

How to loop through an array and get the name corresponding to id and assign the result to another array

I am new to typescript .please help me in doing this. I have an array as below. let pets=[{id:'1',name:'animal'},{id:'2',name:'animal'}]; i want to loop through pets and get the names of animals from another array Category where Category:[{id:'1',name:'Dog'},{id:'2',name:'Cats'},{id:'3',name:'Cows'...
minnu
2

votes
1

answer
29

Views

How to get angular item from $event?

I display on page an array of arrays of objects. And every object has a click event. I want to replace that many clicks events (now it is more than three thousand click events) by one click on wrapper. For example, current code {{cat.name}} + - Desired code {{cat.name}} + - But in event.target I get...
Andrew G
1

votes
3

answer
33

Views

Table row on click function is not working in Angular7

I am trying to call a function whenever i click a row in an HTML table but it is not working and it is not giving any errors. I've tried several things, and online code shows that the way i try it, it should be working. My code is as following: Html: Userstories New Story {{story.id}} {{story.name}}...
Antiwoutertje
0

votes
0

answer
3

Views

ng2-canvas-whiteboard is not working in Angular7.3.5

I followed the instruction for installing ng2-canvas-whiteboard package, but I have a blank page. Here is what I have done: IN Module: import { CanvasWhiteboardModule } from 'ng2-canvas-whiteboard'; @NgModule({ imports: [ CanvasWhiteboardModule, ] In Component: import { CanvasWhiteboardComponent, Ca...
MSH
1

votes
0

answer
5.7k

Views

Angular 7 Default select for dropdown not straight forward

I've been working with Angular 7 recently, and finding some strange stuff happening when trying to display a dropdown list, and showing a default value within this list. Here are two separate lists respectively: sample.component.html {{organization.name}} I find that the above code displays the foll...
Arsalan Khalid
1

votes
0

answer
6

Views

Resetting staggering animation delay on newly generated elements

I am trying to implement a stagger animation when my page is loaded by getting an array of users from my API, then assigning this array to a local variable which is bound to a table with ngFor which then loops and displays the values. I am currently using scss to create an animation delay variable w...
DeutscheBahn
0

votes
0

answer
5

Views

ControlValueAccessor component not updating value in formgroup at angular 7

I'm using angular 7. And I created child component like below Stackblitz by ControlValueAccessor. I have a combobox and textbox in my form. And when I select item from combobox, then value of item set to textbox. But when I clicked 'SAVE' button, my form value coming as empty. What can be the reason...
realist
1

votes
0

answer
219

Views

Error in ngrx immediately after upgrading to Angular 7

error TS2345: Argument of type '(source$: Observable) => Observable' is not assignable to parameter of type 'OperatorFunction' Everything was working perfectly prior to the upgrade. What's causing this error ? How can I fix it ?
geoyws
1

votes
2

answer
125

Views

Moving one DIV element inside another in Angular

I am working with Jquery code in Angular where I want to move one DIV element inside another Here is my code .ts file moveButton(elem) { alert('hello' + elem); if ( $(elem).parent().attr('id') === 'oneDiv' ) { alert('hello' + elem); $(elem).detach().appendTo('#anotherDiv'); } else { $(elem).detac...
Anurag Ranjan
1

votes
0

answer
422

Views

cli command ng new not working for angular 7

Just updated my cli, npm, ng and nodejs to latest versions. An ng v gives this: Angular CLI: 7.0.2 Node: 8.12.0 OS: darwin x64 Angular: ... Package Version ------------------------------------------------------ @angular-devkit/architect 0.10.2 @angular-devkit/core 7...
mohsenmadi
1

votes
1

answer
359

Views

Angular 6/7 circular dependency between libraries

I'm working on a project that's using Angular 7 and I have various angular libraries for the respective modules of the application that I build then publish on (a private) npm to be used by the application. So all angular libraries are imported in the app through their npm package. The problem I'm f...
Marcus
1

votes
0

answer
109

Views

Angular Universal + PM2: Keeps exiting and restarting

I created an Angular 7 application with Angular Universal for SSR. Testing locally, I can see the static contents rendering without any problem. npm run build:prod && npm run server -o However, once the file server.js and folders server and browser are deployed to the server and after starting the a...
Jhourlad Estrella
1

votes
1

answer
22

Views

Save app icons as internal assets or provide them from a remote storage?

I am developing an Angular 7 shopping list application, PWA with CLI Schematics (@angular/pwa). The app will provide the shopping icons grouped by item type inside accordions (around 10 to 20 per category, 2KB to 6KB each). The PWA application will be used by mobile phones only (just for context, as...
Francesco

View additional questions