Category : angular

Consuming functions from a module in App Module

     angular

I am trying to implement Azure AD auth. So able to do it using MSAL 2.0. But regarding dynamically loading the configuration from JSON file I created a service and though about using it for reading JSON file. Here is the Stackblitz . My trouble is I imported the custom module which sets the configuration ..

Read more

Get params from typeOf ngrx effects

     angular, ngrx, observable, rxjs

I have something like this ngOnInit() { this.store.dispatch(new TutorialActions.GetTutorials(1,20)); } export class GetTutorials implements Action { readonly type = GET_TUTORIALS constructor(public number: number, public offset: number) { } } And then i have effects like this export class TutorialEffects { loadTutorials$ = createEffect(() => this.action$.pipe( ofType(TutorialActions.GET_TUTORIALS), switchMap(() => this.tutorialService.getAll(0,20).pipe( map((tutorial: Tutorial[]) => new TutorialActions.SuccesGetTutorials(tutorial)), catchError((error) ..

Read more

Angular i18n routing with locale

     angular, iis, internationalization

I’m using Angular 10 and i18n localization. When I start my application locally (ex. https://localhost:44360/en/list) everything is good, routing works and page refreshes. But when I deploy my app to IIS, page (ex. randomsitename.com/en/list) throws an error. {"StatusCode":500,"Message":"Internal Server Error occured."} index.html (wwwroot) <script> let userLang = navigator.language || navigator.userLanguage; console.log(‘userLang:’ + userLang); if (userLang ..

Read more

Make custom file upload angular component required in the form

     angular, angular-material, html, typescript

I have created a custom file upload angular component and I am using it in a template driven form. The form contains angular material components. I want this custom component to be required with the template driven form. This is the html code for the custom component: <input type="file" class="file-input" (change)="onFileSelected($event.target.files[0])" #fileUpload> <div class="file-upload"> <button ..

Read more

Angular: conditionally render based on whether value was received from Firebase DB

     angular, firebase, firebase-realtime-database, javascript

I have a component: export class MainpageComponent implements OnInit { items: Observable<any[]>; displayElement = false; //whether we will display the elemet or display a loading thing constructor(db: AngularFireDatabase) { this.items = db.list(‘questions’).valueChanges(); } } I am currently displaying the data I receive inside a swiper in the HTML template with no problems: <swiper> <ng-template swiperSlide ..

Read more