CODEWITHSUNDEEP
htmlangular
Ibanez1408
Ibanez1408

Reputation: 5078

Set the file path for an input in angular

I have successfully created a FileReader() instance and can read the text files on file change. But what I need is; without using the input button to select a file, all I have to do is to place the path in an input textbox and read its contents. Please see my code below.

.ts file

fileChanged(e: any) {
    this.file = e.target.files[0];
    this.readDocument();
  }

  readDocument() {
    const fileReader = new FileReader();
    fileReader.onload = (e) => {
      console.log(fileReader.result);
    }
    fileReader.readAsText(this.file);
  }

.html

<div class="Block">
  <label id="lbl">Code </label>
  <input type='file' (change)="fileChanged($event)">
</div>

If fileReader is not a viable option, can you please show me how to do this using another way? Thank you.

Upvotes: 0

Views: 2504

Answers (1)

Simon K
Simon K

Reputation: 230

If I understand correctly, you wish to show the path to the file? That would not be feasible, as javascript cannot read the file system on the user's computer, as that would be a major security flaw.

You would only be able to access the file name and its contents.

Keep in mind this can be done when we're in the context of a serverside script in scenarios using node.js or other serverside frameworks. Also when running things like gulp to do things like build scss into css.

Upvotes: 3

Related Questions