Currently, I am working on implementing an edit functionality that will update the object by adding new data and deleting the old data upon updating. Specifically, I am focusing on editing and updating only the comments$. Although I am able to retrieve th ...
Currently, I have a component that loads animated divs based on a datasource. *Note: In the example, I've used a lot of <any> because I haven't finalized the model yet. apiService.ts dataArray: Observable<Array<any>>; constru ...
I am currently working on an angular application that has a connection with a printer. The printer possesses its own status service that is implemented as a promise, providing the printer's current status as a response. However, I am facing an issue while ...
Q) What is the best way to convert an observable into a promise for easy handling with .then(...)? The code snippet below showcases my current method that I am looking to transform into a promise: this._APIService.getAssetTypes().subscribe( assetty ...
How can I return a reference to a subject from a service without allowing the receiver to call .next() on the subject? Let's say there is a service with a subject that triggers new events. class ExampleService { private exampleSubject = new Subject< ...
Utilizing Firebase as the API in my application for authentication, database management, and storage. Implemented a main page (localhost:4200) that loads when the user is not logged in, and a dashboard (localhost:4200/dashboard) for authenticated users. ...
Provided as shown below: public currentDBUserBS$: any; constructor(private afDb: AngularFireDatabase){} fetchUser(uid){ this.afDb.object(`users/${uid}`).valueChanges().subscribe((dUser) => { if (dUser) { this.currentDBUserBS$ = dUser; ...
Question: Processing Array of Observables with Metadata in Angular How can I process an array of Observables, such as using forkJoin, while passing additional metadata for each Observable to be used in the pipe and map functions? const source = {animal: & ...
I am currently facing a challenge setting up a real-time application using socket.io in Angular and node.js. The application is not functioning as expected. When a client makes a new post, the other clients do not receive updates until there is some inter ...
Utilizing Angular 4 and rxjs, the objective is to fetch data from two distinct servers in JSON format, merge this data, and exhibit it in a list by associating the list with an observable array. **Word Search Component TypeScript File:** @Component( ...
In my code, I have two methods that return two lists: one for accepted users and the other for favorite users. The first part of my code works well and returns both lists, but in the second part, I need to filter out the accepted users who are also on the ...
One of my services is set up like this: @Injectable() export class DataService { constructor(protected url: string) { } private handleError(error: Response) { console.log(this.url); return Observable.throw(new AppError(error)); ...
In my Angular project, I am implementing RxJs with two subjects. s1.next() s1.subscribe(() => { // perform some operation and then trigger the event for s2 s2.next() }); s2.subscribe(() => { // perform some operat ...
I am trying to figure out how to enable MathJax to convert TeX to HTML for elements nested within my div. Here is the current content of app.component.html: <p> When \(a \ne\) It works baby </p> <div class="topnav"> ...
I am currently working on an Angular Reactive form that incorporates custom components. The form includes basic Form Fields and a Froala editor, customized with dropdowns that fetch values from the backend using observables. This is where I encounter some ...
When working with a form that fetches data using an http observable, I encountered the need to disable the submit button while awaiting the response. Currently, I am setting the status code on each component/form to indicate running before calling the sub ...
In my current situation, I am facing an issue where data sent from a component to a service for manipulation is not triggering the desired behavior. The intention was to update a BehaviorSubject variable in the service by using the next method when fetchin ...
While developing an Angular application, I've noticed a recurring pattern in my code structure: @Injectable(...) export class WidgetRegsitryService { private readonly _widgets: BehaviorSubject<Widget[]> = new BehaviorSubject([]); public get ...
I utilized RXJS operators in my code to retrieve an array of locations. Here is the code snippet: return O$ = this.db.list(`UserPlaces/${this.authData.auth.auth.currentUser.uid}`, { query: { orderByChild: 'deleted', equalTo: fal ...
Currently, I am progressing through Moshs' Angular course where we are building a simple shopping page. Despite the tutorial being a bit outdated, I managed to adapt to the changes in bootstrap and angular quite well until I reached the shopping cart secti ...
Monitoring the outputs of a list of observables with mergeMap is straightforward, as shown in this example code snippet: export class TestClass { test() { const observableA = of(1, 2, 3); const observableB = of(7, 3, 6); const observableC = ...
I have a forkjoin set up to check for the presence of a person in two different data stores. If the person is not found in either store, I want to perform a delete action which should return true if successful, and false otherwise. However, my current impl ...
I'm currently working on an Angular 5 Project where speed and responsiveness are crucial when retrieving a large object from the server. To optimize performance, I have broken down the object (resembling a Word Document) into main components (similar to Wo ...
Struggling with the syntax as I delve into learning Angular, I need to transform a promise into an Observable. Let me share what I've encountered: In the function getCountries (subscribed by another utility), there is a call required to fetch a list ...
Currently I am utilizing Angular 6 for creating a few basic features and encountering some difficulties with Observables. In one of my components, I retrieve a project on initialization: ngOnInit() { this.project$ = this.route.paramMap.pipe( sw ...
I'm currently working with the signature_pad library, and I have encountered an issue. When I draw a line, the method toDataURL() returns a string. I have a MessagingService set up to send this string between different Angular components. The goal is ...
After conducting extensive research on the Internet, I am still struggling to connect the pieces. My angular2 application utilizes an Observable data source from HTTP and I am attempting to integrate ag-grid. However, all I see is a loading screen instead ...
When I send my request to the API and parse it using the map function, the following code is executed: // portion of service post(url: string, params): Observable<Response> { let requestUrl: string = this.apiUrl + url; return this.http.post(r ...
I have an Observable containing an array that I need to extract so I can combine it with another array. this.builderService.getCommercialData() .subscribe( data=>{ this.commercialDetails = data; this.commercialDetailsArr ...
I am currently developing an Angular application and working on implementing a system where an NGRX effect will make requests to a service. This service will essentially perform two tasks: Firstly, it will check the local cache (sqlite) for the requested ...
I am currently working on an Angular 4 project. One of the features I have implemented is a search component, where users can input a string. Upon submission of the value, I send this value from the SearchComponent to the DisplayComponent. The process of ...
I'm facing an issue with accessing data from my backend. Although the service successfully retrieves and logs the data, when I try to use that service in a different module, it either shows "undefined" or "Observable". Does anyone have any suggestions on h ...
@Component({ selector: 'app-geo', templateUrl: <img mat-card-image [src]="profileUrl | async "> export class GeoComponent implements OnInit { date; profileUrl: Observable<string>; constructor(private tempService: Temperat ...
I am using the final version of Angular 2 and attempting to make an HTTP request that relies on another HTTP request. In my scenario, I am trying to retrieve an account with the user ID as a parameter which is obtained from another HTTP request (getUser). ...
This is how I approach the situation: filter(value) { this.backendCall(value) } To prevent my method from being called repeatedly for every keystroke, I aim to introduce a pause between backend requests using Observable.timer() and switch ...
My observable is being filled with data from the backend using a service. The backend is providing the correct data, but I am having trouble building a pie chart with the values from the observable. The relevant part of the code is as follows: this.dataSe ...
After carefully declaring all the variables, I am facing an issue with passing the value obtained from the first observable function (this.acNum) as a parameter to resolve the second observable function within the ngOnInit method. Despite displaying correc ...
I am facing an issue with the code below. The navigation is happening when a customer is created, instead of waiting for the address to be created successfully. Any assistance on this matter would be greatly appreciated. createCustomer(model: any) { ...
When attempting to chain Observable.interval() with .flatMap(), I encountered what seems to be unexpected behavior. Below is the code snippet I am using (with Angular 2): Observable.interval(1500) .scan((numArr:any[], curr:any, i:number) => { nu ...
Within my file manager UI, each individual file item is currently set to monitor the window's wheel event. As soon as a file item comes into view on the page, its corresponding image loading process will be initiated by the file item component. While ...
One of the challenges I'm currently facing in my Angular application is the synchronization of data from a server. To keep track of when the last synchronization took place, I have implemented a function to retrieve this information: fetchLastSyncDate ...
Initially, the task was to send JSON data from the parent component to the child component. However, loading the data through an HTTP request in the ngOnInit event posed a challenge as the data wasn't being transmitted to the child component. Here is ...
Is there a way to assign the value of an <input> as false? It seems to work fine with true. Data Model: function DataModel(){ self = this; self.Flag = ko.observable(false); }; HTML Code: <input type="text" data-bind="value:Flag"/> ...
I have an issue with a function that returns an Observable. The problem is that when the function is called, the parameter works fine, but its value becomes undefined within the Observable. This is the function in question: import {Observable} from &apos ...
Within the service class, I have defined a property like this: articles: Observable<Article[]>; This property is populated by calling the getArticles() function which uses the conventional http.get().map() approach. Now, my query is about manually ...
Introducing my unique service named VenueAdminInceptionService import {Subject} from 'rxjs/Subject'; import {Observable} from "rxjs/Observable"; import {VenueAdminInceptionModel} from '../../models/venueadmininceptionmodel/venueadmin.inception.model'; ex ...
I have a trio of services that return observables. The initial service retrieves a list of recipes, the second service fetches all ingredients for a specific recipe, and the final one acquires the quantity of a specific ingredient type. My goal is to call ...
I'm working with Angular and calling a REST API that returns data in JSON Array of Objects like the example shown in this image: https://i.stack.imgur.com/Rz19k.png However, I'm having trouble converting it to my model class array. Can you provide some gu ...
After following a tutorial on creating dynamic checkboxes, I now need to implement dynamic checkboxes using an API request. In my implementation so far, I have defined the structure as shown below: inquiry-response.ts interface Item { // Item interface ...
Currently on the journey of teaching myself Angular2 and TypeScript after enjoying 4 years of working with AngularJS 1.*. It's been challenging, but I know that breakthrough moment is just around the corner. In my practice app, I've created a service to fe ...
I am facing an issue in Angular 4 where I am attempting to retrieve details from a specific user when clicking on the 'user link profile'. However, I am unable to subscribe to my function because the return value of switchMap is AnonymousSubject ...
I am facing an issue with the PrimeNG TabView tabs when trying to populate them with data fetched from the server using Observables. I have included a sample example here for reference: https://stackblitz.com/edit/primeng-nx7ryc?file=app%2Fapp.component.t ...
Here are my component file and service file. I am trying to achieve that after the verification() service method is successfully called, I want to trigger another service method signup() within its success callback inside subscribe. However, I am encounter ...
I encountered an issue with my solution that initially appeared to be working, but when tested on a slow network: public getKeyFigureValuesForAllClients(keyFigurename: string) { const keyFigureDefintion$ = this.keyFigureDefintions$.pipe( flatMap ...
Instead of subscribing to route.queryParams as an Observable, I want it to be a Promise so that I can use async/await for function calls in ngOnInit. However, my attempt at this is not working as expected. The code below does not produce any output: constr ...
Working with Observable (specifically using Rxhttp) and connect-timeout to handle long running requests has been presenting a challenge. Despite hitting the error handling middleware, the .subscribe function continues to run, leading to errors like: Err ...
My goal is to fetch a list of dogs from a database and return it as an Observable<Dog[]>. However, whenever I attempt to convert the incoming stream to an array by using toArray() or any other method, no data is returned when calling the retrieveDo ...
I am currently working on a page that showcases a list of locations, with the ability to click on each location and display the corresponding assets. Here is how I have structured the template: <li *ngFor="let location of locations" (click)="se ...
My challenge is that I'm attempting to handle a HttpError or HttpErrorResponse using an observable. However, the only option I have is to handle the HttpResponse, which is necessary but not sufficient. I also need to find a way to avoid this limitation. h ...
While attempting to iterate over an array, I noticed that the DOM is displaying [ object Object] instead of the desired information. Some sources suggested using Stringify to display the info, but it's not possible to iterate over a string. Any assistance ...
Seeking assistance with Angular translation service and Kendo.UI components. In the Kendo.UI documentation, it mentions the use of MessageService for component translation implementation. To achieve this, an abstract class must be extended containing a m ...
In one of my templates, I have the following code snippet: <app-name val="{{ (observable$ | async)?.field > 0 || "No field" }}" The goal here is to retrieve the value of the property "field" from the Observable only if it is grea ...
In my TypeScript file (simplified component) below code is present: public param_getting_updated_inHTML: number = 0; public param_NOT_getting_updated_inHTML: number = 0; ngOnInit(): void { this.store.select(selectorName).subscribe( (data) => ...
Despite my attempt to transform the data before resolving it, the subscriber is still receiving the non-transformed data. @Injectable() export class OrderService { getAll(): Observable< Array<Order> > { let url = 'http://fakeapi.co ...
So I'm on a mission to enhance my knowledge by utilizing a service that fetches a list of Posts and then for each post, making another call to retrieve the associated comments. The data I'm working with can be found at https://jsonplaceholder.typicode.com ...
Struggling to incorporate map, PublishReplay, and other rxjs functions into Angular6, I keep encountering a compilation error stating "Property 'map' does not exist on type 'Observable<[{}, {}]>'" every time. The same issue arises when attempting to use ...
Currently, I am in the process of learning Angular2 and RxJS by studying someone else's application. The application consists of two modules: asObservable.ts export function asObservable(subject: Subject) { return new Observable(fn => subject.subs ...
I've been working on building a complex Angular2 application and I've run into issues with the UI not updating properly to reflect changes in the application state. I've done a lot of research on how to solve this issue and tried implementin ...
Recently, I came across an old tutorial on Redux-Firebase-Angular Authentication. In the tutorial, there is a confusing function that caught my attention: The code snippet in question involves importing Actions from @ngrx/effects and other dependencies to ...
While working on my Angular web application, I encountered an issue with displaying data when using Observables and Subjects. Typically, when searching the Firebase DB, I use *ngFor="let myvar of _myvar | async" in my HTML to display the retrieve ...
After successfully logging in using a service in Angular, I am encountering an error while trying to hide the signin and signup links. The error message can be seen in this screenshot: https://i.stack.imgur.com/WcRYm.png Below is my service code snippet: ...
I have a JSON file located at assets/constants/props.json. Inside this file, there is a key called someValue with the value of abc. The structure of the JSON file can be seen in the following image: https://i.stack.imgur.com/MBOP4.jpg I also have a serv ...
I have 3 observables that need to be chained together, with the result from the first one used in the other 2. They must run sequentially and each one should wait for the previous one to complete before starting. Is there a way to chain them without nestin ...
I have a variety of @Selects within a component structured like this: @Select(ItemState.getMode) mode: Observable<Item>; @Select(QuestionState.SingleQuestion) question: Observable<Question>; @Select(ItemState.getItemNames) itemNames: Observabl ...
Currently utilizing the Subject observable provided by rxjs. In my component, I have implemented two methods. Search search(terms: Observable<string>) { return terms.pipe( debounceTime(400), distinctUntilChanged(), switchMap(term => ...