Can we make matSuffix float left?

I just want to display a number with % so I choose matSuffix. However I can’t make it float to the left. The number and % are separated by spaces. My code: <mat-form-field> <input matInput [(ngModel)]=value type="number" class="example-left-align"> <span matSuffix>%</span> </mat-form-field> CSS: .example-left-align { text-align: left; } input.example-left-align::-webkit-outer-spin-button, input.example-left-align::-webkit-inner-spin-button { display: none; } input.example-left-align { […]

By Bigeyes
Published
Categorized as angular, angular-material, css Tagged , ,

How to get token from url and clientId etc

I have registered my application in Azure, so I have tenantId, clientId etc. Now I can get the access token by the following code. const myUri = ‘https://login.microsoft.com/’ + this.tenantId+ ‘oauth2/v2.0/authorize?clientId=’ + this.clientId + ‘redirect_uri=window.location.origin’ + ‘&response_type=id_token&response_mode=fragment&scope=openid&state=11111&nonce=123’; windows.open(myUri, ‘self’); Then in somewhere, we can get the access token by splitting urifragment from window.location.herf. But there […]

By Bigeyes
Published
Categorized as angular, azure, azure-active-directory, http Tagged , , ,

How do I know that I already single sign-on in angular application?

I use https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/v2-docs/configuration.md to setup a single sign-on in angular. So if I click the sign in button then I can login. My question is that if in other place I already login with my company’s credentials so I don’t need to login again in the angular application. How my angular application knows I already […]

By Bigeyes
Published
Categorized as angular, azure, msal, msal-angular Tagged , , ,

msal dynamic load config in angular

I want to use msal to login and get token. For some reason, I have to dynamic load config parameters to msal request. Unfortunately https://docs.microsoft.com/en-us/azure/active-directory/develop/tutorial-v2-angular-auth-code is not able to do dynamic configuration. The clientId is hardcoded. But I want to change it by environment. This one and #481 issue are for msal 1.x. In msal […]

By Bigeyes
Published
Categorized as angular, angular11, msal, msal-angular Tagged , , ,

How to retrieve the values from useFactory?

In my appModule. let id = ”; @NgModule({ providers: [ { provide: AppConfig, useFactory: getUseFactory, deps: [AppConfig], multi: true }, ], }) I use useFactory to return an object. export function getUseFactory(config: ApiConfig) { return () => config.loadEnvConfig(); } The thing is config.loadEnvConfig() is a json object. I want to assign id from it. What […]

By Bigeyes
Published
Categorized as angular Tagged

How to click CSS text-overflow ellipsis to display a long text in pop up?

I have a long sentence in table cell. So I use text-overflow to show ellipsis. My question is how to click the dots(…) to show the entire text in a popup? table { width: 100%; table-layout: fixed; } table td { border: 1px solid red; padding: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } StackBlitz […]

By Bigeyes
Published
Categorized as angular, css, html Tagged , ,

How to click CSS text-overflow ellipsis to display a long text in pop out?

I have a long sentence in table cell. So I use text-overflow to show ellipsis. My question is how to click the dots(…) to show the entire text in a popup? table { width: 100%; table-layout: fixed; } table td { border: 1px solid red; padding: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } StackBlitz […]

By Bigeyes
Published
Categorized as angular, css, html Tagged , ,

How to assign the first element context with default value?

I am using the follwing code to display some values from the array <div class="row"> <div class="column" *ngFor="let card of cards; let i=index"> <div class="card"> <h3>Card {{card.id}}</h3> <p>{{card.text}}</p> </div> </div> </div> But I would like to set the first one is a button with given hard code text. It shouldn’t from the array. I think […]

By Bigeyes
Published
Categorized as angular, css, html, ng-class Tagged , , ,

Display the context only on the home page; if navigate to other component then the message must be gone

Say I have a bunch components. Home, One, Two and Three. I use nav and routing to every page. I want to display a message "Hello" only on Home page. Then in other pages the message must be gone. Stackblize The main structure of app.component.html is <h1>Angular Router</h1> <nav> <a routerLink="/crisis-center" routerLinkActive="active">Home</a> <a routerLink="/heroes" routerLinkActive="active">Heroes</a> […]

By Bigeyes
Published
Categorized as angular Tagged

How to retrieve url in spring boot and use it in Angular?

In spring boot, the base url maybe localhost:8080 or a different one. Now I want to use it in angular. I saw that many examples online just hardcode it in angular http client call code. But the base url can be changed, for example the port number changed or the environment is changed from dev […]

By Bigeyes
Published
Categorized as angular, java, spring-boot Tagged , ,

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq