Open Closed

Angular: How do I use current login information in xx-component.ts file? #319


User avatar
0
gvnuysal created

Hi support, I have a two question.

I don't want to see footer div in my Abp Commercial Angular project. How do I do it? My other question is: I need to login to another project in iframe with abp commercial login information. How do I get the login information? How do I get user information from currentUser$ in the code I share.

Note: I need to get the user information in the xxx-component.ts file.

import { ApplicationConfiguration, AuthService, ConfigState, } from '@abp/ng.core'; import * as $ from "jquery" import { Select, Store } from '@ngxs/store'; import { Observable } from 'rxjs'; import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-root',
  template: '
    <abp-loader-bar></abp-loader-bar>
    <abp-dynamic-layout></abp-dynamic-layout>
  ',
})
export class AppComponent implements OnInit{
  constructor(private store: Store, private authService: AuthService) {}
  @Select(ConfigState.getOne('currentUser'))
  currentUser$: Observable<ApplicationConfiguration.CurrentUser>;

  ngOnInit(){   
    this.LoginService();
  }

  LoginService(){
    
    $.ajax({
      url:"http://x.x.x.x:8080/myApp/loginservice",
      type: "POST",
      data: {
        username: "guven",   
        password: "bpm",
        redirect: false,
      },  
      headers: { "Content-Type": "application/x-www-form-urlencoded" },
      xhrFields: { withCredentials: true },
      success: function (data, textStatus, jqXHR) {
        
        $.ajax({
          url:"http://x.x.x.x:8080/bonita/API/system/session/unusedId/1",
          type:"GET",
          xhrFields: { withCredentials: true },
          success: function (data, textStatus, jqXHR) {
            console.log("success getting session");
            console.log(jqXHR);
          
          },
          error: function (jqXHR, textStatus, errorThrown) {
            console.log("error getting session");
          }
        });
      },
      error:function(jqXHR,textStatus,errorThrown) {
      
        console.log("error login")
      }
    });
  }

}

2 Answer(s)
  • User Avatar
    0
    Mehmet created

    Hi @gvnuysal

    Open styles.scss file and add the below style to hide the footer:

    abp-application-layout footer.lp-footer {
      display: none;
    }
    

    You can get the current user informatin as shown below:

    import { ConfigStateService, ApplicationConfiguration } from '@abp/ng.core';
    
    @Component(/* component metadata*/)
    export class YourComponent {
      constructor(private config: ConfigStateService) {
        const currentUser = this.config.getOne('currentUser') as ApplicationConfiguration.CurrentUser;
       }
    }
    

    If you like to get access token, call the getAccessToken() method of OAuthService:

    import { OAuthService } from 'angular-oauth2-oidc';
    
    @Component(/* component metadata */)
    export class YourComponent {
      constructor(private oAuthService: OAuthService) {
        const accessToken = this.oAuthService.getAccessToken()
      }
    }
    

    I hope your questions are answered. Thanks.

  • User Avatar
    0
    gvnuysal created

    Hi Mehmet, Thanks your answer.

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11