Project is an angular/core solution.
I was trying to determine what information some variables were holding during certain method calls, but I could only get the method to hit my VS Code breakpoint when the application starts up, and when I load the page that the Rad tool made for my entity.
I started checking the createUser method in the users.component.ts file since it is rather similar to the method I am trying to check (the create method for a rad tool created entity). The createUser method debugs perfectly. It breaks when the page loads, and it breaks when you hit the create user button. The similar method create with the rad tool however, only hits the breakpoint when the page loads.
12 Answer(s)
-
0
Hi @dev1_premierpoint
- Is this an Angular page ?
- If so, could you share the generated TypeScript code and where do you expect a breakpoint ?
Thanks,
-
0
The page is Angular.
I'm expecting a break at the createOdeCred method, so that I can follow the path down the show method within. It is my assumption that the generated createOdeCred method works similarly to the createUser method in that it is called when the create new user (or in the case new odeCred) button is pressed.
import { Component, Injector, ViewEncapsulation, ViewChild } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { OdeCredsServiceProxy, OdeCredDto } from '@shared/service-proxies/service-proxies'; import { NotifyService } from 'abp-ng2-module'; import { AppComponentBase } from '@shared/common/app-component-base'; import { TokenAuthServiceProxy } from '@shared/service-proxies/service-proxies'; import { CreateOrEditOdeCredModalComponent } from './create-or-edit-odeCred-modal.component'; import { ViewOdeCredModalComponent } from './view-odeCred-modal.component'; import { appModuleAnimation } from '@shared/animations/routerTransition'; import { Table } from 'primeng/table'; import { Paginator } from 'primeng/paginator'; import { LazyLoadEvent } from 'primeng/public_api'; import { FileDownloadService } from '@shared/utils/file-download.service'; import * as _ from 'lodash'; import * as moment from 'moment'; @Component({ templateUrl: './odeCreds.component.html', encapsulation: ViewEncapsulation.None, animations: [appModuleAnimation()] }) export class OdeCredsComponent extends AppComponentBase { @ViewChild('createOrEditOdeCredModal', { static: true }) createOrEditOdeCredModal: CreateOrEditOdeCredModalComponent; @ViewChild('viewOdeCredModalComponent', { static: true }) viewOdeCredModal: ViewOdeCredModalComponent; @ViewChild('dataTable', { static: true }) dataTable: Table; @ViewChild('paginator', { static: true }) paginator: Paginator; advancedFiltersAreShown = false; filterText = ''; constructor( injector: Injector, private _odeCredsServiceProxy: OdeCredsServiceProxy, private _notifyService: NotifyService, private _tokenAuth: TokenAuthServiceProxy, private _activatedRoute: ActivatedRoute, private _fileDownloadService: FileDownloadService ) { super(injector); } getOdeCreds(event?: LazyLoadEvent) { if (this.primengTableHelper.shouldResetPaging(event)) { this.paginator.changePage(0); return; } this.primengTableHelper.showLoadingIndicator(); this._odeCredsServiceProxy.getAll( this.filterText, this.primengTableHelper.getSorting(this.dataTable), this.primengTableHelper.getSkipCount(this.paginator, event), this.primengTableHelper.getMaxResultCount(this.paginator, event) ).subscribe(result => { this.primengTableHelper.totalRecordsCount = result.totalCount; this.primengTableHelper.records = result.items; this.primengTableHelper.hideLoadingIndicator(); }); } reloadPage(): void { this.paginator.changePage(this.paginator.getPage()); } // ###### expecting break here ###### createOdeCred(): void { this.createOrEditOdeCredModal.show(); } deleteOdeCred(odeCred: OdeCredDto): void { this.message.confirm( '', this.l('AreYouSure'), (isConfirmed) => { if (isConfirmed) { this._odeCredsServiceProxy.delete(odeCred.id) .subscribe(() => { this.reloadPage(); this.notify.success(this.l('SuccessfullyDeleted')); }); } } ); } }
-
0
Is that debugger work? (check it in your chrome console)
createOdeCred(): void { + debugger; this.createOrEditOdeCredModal.show(); }
-
0
Adding the debugger statement did work yes. Although, I'm still not sure why the regular debug breakpoint won't catch there.
-
0
Could I get information as to why the debugging isn't working normally, rather than just forcing it to?
-
0
Hi @dev1_premierpoint,
Could you also share how
createOdeCred
is called from your html code ? -
0
This is a very basic page created by the rad tool. The call is made from the create button.
<div [@routerTransition]> <div class="kt-content kt-grid__item kt-grid__item--fluid kt-grid kt-grid--hor"> <div class="kt-subheader kt-grid__item"> <div [class]="containerClass"> <div class="kt-subheader__main"> <h3 class="kt-subheader__title"> <span>{{l("OdeCreds")}}</span> </h3> <span class="kt-subheader__separator kt-subheader__separator--v"></span> <span class="kt-subheader__desc"> {{l("OdeCredsHeaderInfo")}} </span> </div> <div class="kt-subheader__toolbar"> <div class="kt-subheader__wrapper"> ##### The method is called on this button press ##### <button *ngIf="isGranted('Pages.OdeCreds.Create')" (click)="createOdeCred()" class="btn btn-primary blue"><i class="fa fa-plus"></i> {{l("CreateNewOdeCred")}}</button> </div> </div> </div> </div> <div [class]="containerClass + ' kt-grid__item kt-grid__item--fluid'"> <div class="kt-portlet kt-portlet--mobile"> <div class="kt-portlet__body"> <form class="kt-form" autocomplete="off"> <div> <div class="row align-items-center"> <div class="col-xl-12"> <div class="form-group m-form__group align-items-center"> <div class="input-group"> <input [(ngModel)]="filterText" name="filterText" autoFocus class="form-control m-input" [placeholder]="l('SearchWithThreeDot')" type="text"> <span class="input-group-btn"> <button (click)="getOdeCreds()" class="btn btn-primary" type="submit"><i class="flaticon-search-1"></i></button> </span> </div> </div> </div> </div> <div class="row" [hidden]="!advancedFiltersAreShown"> <div class="col-md-12"> <div class="kt-separator kt-separator--border-dashed"></div> </div>
-
0
Hi @dev1_premierpoint
It all seems fine. It might be related to your editor configuration. Did you tried this on another dev machine ?
-
0
We are running this project locally for once to help with load times, so no we haven't tried it on another machine. I'll look into what could be wrong with my editor. Thank you.
-
0
Hi @dev1_premierpoint,
I will leave this issue open and wait for your feedback.
Thanks,
-
0
I appreciate it. Hopefully I will come back with a definite reason for the debugger not working as I assume it would.
-
0
Thanks @dev1_premierpoint :)