Activities of "bunyamin"

Hello again,

The cause of this issue was the default value of container input of ngbDatepicker is not "body". https://ng-bootstrap.github.io/#/components/datepicker/api#NgbInputDatepicker

We've fixed it in ThemeSharedModule which is used throughout the application and will be available in the patch version. Meanwhile, you can fix it by simply setting container="body" it as follows:

<input
  ...
  ngbDatepicker
  container="body"
  ...
/>

Hello,

You can simply use abp-page-toolbar-container as explained in the docs

Hello,

Thanks for reporting this issue. There are some known issues with abp-modal which will be fixed in 4.3.1 patch version.

Hello,

Could you please elaborate more or share few details about what you'd like achieve? It's hard for me to understand your question as is.

Hi,

I'm glad that you were able to get the file-management module up and running.

Regarding your other question, the angular packages of CMSKit and FormsModule have not been developed yet. We don't have an exact plan for those modules because we are working on some other features/projects that have higher priority.

Closing this issue since the original problem is solved.

Yes, there has been another fix there as well but it was still working as you described in the first post. We've decided that we should offer an API to dismiss all of the active modals which can be used in other cases as well.

Hello,

We've just implemented a service that can be used to dismiss all of the active modals. It's just been merged into the branch and you will be able to use it with version 4.3

Here is how you can use it

import { ModalRefService } from '@abp/ng.theme.shared';

constructor(private modalRef: ModalRefService) {}

...

this.modalRef.dismissAll('hard'); // does not trigger warnings and force dismisses the modal
this.modalRef.dismissAll('soft'); // triggers warnings as it does now

Hello,

I assume you already added backend code and File-Management API is up and running. The following instructions are to add angular code only.

Navigate to your angular project and run the following command

• Firstly, we need to create a library within our application with which we will replace with the downloaded file-management code.

yarn ng g library file-management or if you are using npm npm ng g library file-management which will create a library named file-management within projects folder, also this command will update angular.json and tsconfig.json files as well.

Open tsconfig.json and replace file-management within paths with the marked lines

{
  "compileOnSave": false,
  "compilerOptions": {
    // ...
    "paths": {
      "@proxy": ["src/app/proxy/index.ts"],
      "@proxy/*": ["src/app/proxy/*"],
      "@volo/abp.ng.file-management": ["projects/file-management/src/public-api.ts"], // <- this line
      "@volo/abp.ng.file-management/config": ["projects/file-management/config/src/public-api.ts"] // <- and this line
    }
  },
  // ...
}

• Secondly, we need to install 3rd party libraries that the file-managementmodule needs.

npm install @uppy/core @uppy/xhr-upload @uppy/dashboard or yarn add @uppy/core @uppy/xhr-upload @uppy/dashboard

• Then, we need to enable synthetic default imports because of the 3rd party libraries. Open tsconfig.json and enable the following option

"allowSyntheticDefaultImports": true, within complierOptions

• At this point, you can replace the content of projects/file-management with the downloaded code.

Your project structure should look like the following

• Now we need to edit two files and we are good to go.

Open up app.module.ts and import FileManagementConfigModule into your AppModule

import { FileManagementConfigModule } from '@volo/abp.ng.file-management/config';

@NgModule({
  declarations: [AppComponent],
  imports: [
    // ...
    FileManagementConfigModule.forRoot(), 
  ],

})
export class AppModule {}

• Finally, open up app-routing.module.ts and add the following route config to routes array

const routes: Routes = [
  // ...
  {
    path: 'file-management',
    loadChildren: () =>
      import('@volo/abp.ng.file-management').then(m => m.FileManagementModule.forLazy()),
  },
];

Everything should work just fine and you can start editing file-management code. You can see the edited header below.

Also, if you want to move file-management link to the root in navbar, open up route.provider.ts in file-management/config/src/providers and remove the commented line

   routes.add([
      {
        path: '/file-management',
        name: eFileManagementRouteNames.FileManagement,
        layout: eLayoutType.application,
        // parentName: eThemeSharedRouteNames.Administration,
        iconClass: 'fa fa-folder-open',
        order: 6,
        requiredPolicy: eFileManagementPolicyNames.DirectoryDescriptor,
      },
    ]);

Keep in mind that, we often add new features to the File-Management module. Using its code within your project will make it hard to upgrade and utilize new features.

Hello,

@abp/ng.core package provides a service, directive and a route guard that you can use. Would any of it help you?

Please refer to the docs

Hi,

You used to be able to make your request call before. What I suggested was a configuration for CORS. It should not have anything to do with "415 unsupported media type". Change your code back to what it was (when you could make the call but could not read the headers) and add .WithExposedHeaders("Content-Disposition"). When everything is done correctly, you should see the following among the response headers:

Access-Control-Expose-Headers: _AbpErrorFormat, Content-Disposition