Base solution for your next web application

Activities of "Hammer"

Answer

For the record, the link provides a very partial solution. Here is a complete one: export class SomeComponent extends AppComponentBase {         private stepper: any;         constructor(         injector: Injector,            ) {         super(injector);     }

    ngAfterViewInit() {         // Make sure KTStepper is accessible         const KTStepper = (window as any).KTStepper;

        if (KTStepper) {             const stepperElement = document.getElementById('kt_stepper_example_basic');             if (stepperElement) {                 this.stepper = new KTStepper(stepperElement);

                document.getElementById('kt_stepper_next')?.addEventListener('click', () => {                     this.stepper.goNext();                 });

                document.getElementById('kt_stepper_prev')?.addEventListener('click', () => {                     this.stepper.goPrevious();                 });

                document.getElementById('kt_stepper_submit')?.addEventListener('click', () => {                     this.stepper.submit();                 });

                this.stepper.on('kt.stepper.changed', (stepper) => {                     const currentStepIndex = stepper.getCurrentStepIndex();                     this.handleStepChange(currentStepIndex);                 });             }             }

Question

Hello, I'm using version 13.1. How would it be possible to use the KTStepper that is provided by Metronic in Angular? Styles seem to be partly included, but not all them, same goes with type KTStepper, which does not seem to exist OOB.

Implementation as shown here: https://preview.keenthemes.com/html/metronic/docs/general/stepper mentions events that I can not listen to. Would you happen to have any leads?

Hello pkouame, were you able to make anonymous access to your application, in the end? If you would share some insights, I would be very interested and grateful.

I’m not entirely sure, but I think you should configure the app so that the Swagger page will not be generated at all in a production environment.

Hello, I'm using Angular + Asp.net core, v13.

I'm a bit puzzled about how to use Metronic's stepper wizard. I understood that there is KTWizard that I can use, but as far as I know, no angular component is provided, at least I can't find a suitable import for my Typescript component.

From https://preview.keenthemes.com/metronic-v6/?page=docs&section=wizard, I understand that I have to reference the js library to be able to use it (that's understandable)... But then, where ? KTWizard object is not recognized in my typescript component, because I did not import anything...

Could you please help ?

My problem was due to the fact that no log is recorded anywhere on my computer, apparently. After checking a bit everywhere online, I found that I could still check the output directly in VS, in the output window by selecting the Web.Host output.

Obvious, but if you don't know... Problem was about a validator that was incorrectly set.

[Range(OrganizationUnitExtendedConsts.MaxDDDefaultDay, OrganizationUnitExtendedConsts.MinDDDefaultDay)]
        public int DirectDebitPreferedDay { get; set; }

Should be

[Range(OrganizationUnitExtendedConsts.MinDDDefaultDay, OrganizationUnitExtendedConsts.MaxDDDefaultDay)]
        public int DirectDebitPreferedDay { get; set; }

One thing remains to be seen: why don't I have any record of the logs in my IIS Express directory ?...

Hello, I'm using version 11.3, Angular .Net Core.

I tried extending the OrganizationUnit class by following documentation, but came to a bizarre behaviour in OrganizationUnitAppService's UpdateOrganizationUnit method.

Here is my new class:

public class OrganizationUnitExtended: OrganizationUnit
{    
    [Range(OrganizationUnitExtendedConsts.MinDDDefaultDay, OrganizationUnitExtendedConsts.MinDDDefaultDay)]
    public int DirectDebitPreferedDay { get; set; }
}

I ran the Migrations and thus added the column in DB.

Then, I created a DBSet for my new class in DBContext class:

public virtual DbSet<OrganizationUnitExtended> OrganizationUnitsExtended { get; set; }

In OrganizationUnitAppService, I replaced

private readonly IRepository<OrganizationUnit, long> _organizationUnitRepository;

with 

private readonly IRepository<OrganizationUnitExtended, long> _organizationUnitRepository;

I also changed OrganizationUnitDto to include my new property, and created a new UpdateOrganizationUnitExtendedInput.

public class UpdateOrganizationUnitExtendedInput
    {
        [Range(1, long.MaxValue)]
        public long Id { get; set; }

        [Required]
        [StringLength(OrganizationUnit.MaxDisplayNameLength)]
        public string DisplayName { get; set; }

        [Range(OrganizationUnitExtendedConsts.MaxDDDefaultDay, OrganizationUnitExtendedConsts.MinDDDefaultDay)]
        public int DirectDebitPreferedDay { get; set; }

    }

I then changed UpdateOrganizationUnit method to this:

 [AbpAuthorize(AppPermissions.Pages_Administration_OrganizationUnits_ManageOrganizationTree)]
        public async Task<OrganizationUnitDto> UpdateOrganizationUnit(UpdateOrganizationUnitExtendedInput input)
        {
            var organizationUnit = await _organizationUnitRepository.GetAsync(input.Id);

            organizationUnit.DisplayName = input.DisplayName;

            await _organizationUnitRepository.UpdateAsync(organizationUnit);

            return ObjectMapper.Map<OrganizationUnitDto>(organizationUnit);
        }

I have no trouble retrieving OrganizationUnit from this appService, but whenever I call UpdateOrganizationUnit, I get a 500 response, without ever reaching the method (Breakpoints inside the methos are not reached).

Is there something obvious I'm missing?

Hello devworkers,

would you agree to share the yaml you are using to build and publish the angular part of your application ? I am currently working on it and find mysylf stuck on this matter.

+1

Is there any news for this? I would be very interested in it. I tried to setup a pipeline, managed to make the backend part work, but am currently stuck with the angular part.

Here is what I have so far in my yml:

`trigger: - release

jobs:

- job: Frontend displayName: Frontend Processing continueOnError: false

pool:   vmImage: 'ubuntu-latest'   steps:   - task: NodeTool@0   inputs:   versionSpec: '12.x'   displayName: 'Install Node.js 12.x'   - task: Npm@1   displayName: 'Angular CLI'   inputs:   command: custom   verbose: false   customCommand: 'install @angular/[email protected]'   - task: Npm@1   displayName: 'npm install'   inputs:   verbose: false   - task: Npm@1   displayName: Build   inputs:   command: custom   verbose: false   customCommand: 'start'   - task: CopyPublishBuildArtifacts@1   displayName: 'Copy Publish Artifact: test'   inputs:   CopyRoot: dist   Contents: '**'   ArtifactName: test   ArtifactType: Container   - task: DownloadPipelineArtifact@2   displayName: 'Download Pipeline Artifact'   inputs:   targetPath: ' $(Build.ArtifactStagingDirectory)/dist/AngularTest'

- job: Backend displayName: Backend Processing dependsOn: Frontend continueOnError: false`

Showing 1 to 10 of 13 entries