How can I spawn a File picker for the File Managment module from my component #623

9 Answer(s)

• 

  0

  bunyamin created 3 years ago

  Hello,

  I'm not quite sure about what you are trying to achieve. Could you explain your case little bit further with images if possible?

  Thank you

  Save Cancel
• 

  0

  alper created 3 years ago

  Support Team Director

  if you are trying to achieve something like this "adding a picture to the user", then you need to implement this manually, by adding a byte[] to the IdentityUser and showing it on the relavant UI's... this module is for managing general files without any entity relationship.

  Save Cancel
• 

  0

  GregB created 3 years ago

  Hi yea, sorry.

  I want to allow the user to select a file from the file manager and associate it with an entity.

  Obviously I'll need some kind of property on my entity to store the reference.

  Let's say I have an Application Form entity and I want a Signed Copy attaching to it. I'd like the user to click a button to spawn the file browser (the tree view in file management) and then be able to browse and select a file. I imagine the file browser would give me back an Id or a FileDto which has the Id and/or virtual path to the file. I can then store this Id in my entity.

  Save Cancel
• 

  0

  bunyamin created 3 years ago

  If you simply want to enable users to choose a picture from their computer, you can use something like <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg">. This is the native way of choosing files from your computer.

  If you want them to choose a file that is already uploaded via the file-management module, you have to implement your own interface to do it. For the tree component, we use the tree component of ng-zorro

  Save Cancel
• 

  0

  GregB created 3 years ago

  Hi @bunyamin.

  Thanks for the reply. Yes, I want to use the the File Management system for a few features. Presumably the FileManagement AppService has some methods that build a ViewModel suitable for passing to ng-zorro. Is there any documentation around it's API so I can look at re-using it?

  Thanks, Greg

  Save Cancel
• 

  0

  alper created 3 years ago

  Support Team Director

  I'm not sure if this helps https://docs.abp.io/en/commercial/latest/modules/file-management But I'd do it without File Management. It'd be a forced solution.

  Save Cancel
• 

  0

  bunyamin created 3 years ago

  Hello @GregB,

  We are utilizing this tree adapter which is available within @abp/ng.components package.

  Hope it helps.

  Save Cancel
• 

  0

  GregB created 3 years ago

  Hey @bunyamin,

  Thanks for that pointer. Any chance you can give me a snippet of how you wire it up?

  Cheers, Greg

  Save Cancel
• 

  0

  bunyamin created 3 years ago

  Hello,

  You can simply initiate it as new TreeAdapter(list).

  The important bit is that the list should have children that has fields like id, parentId which builds up the tree.

  Save Cancel