{"id":20356420,"url":"https://github.com/sparrowjang/ngfilereader","last_synced_at":"2025-04-12T02:51:25.199Z","repository":{"id":14814960,"uuid":"17537435","full_name":"SparrowJang/ngFileReader","owner":"SparrowJang","description":"This is file reader component on angular.","archived":false,"fork":false,"pushed_at":"2017-04-11T15:08:34.000Z","size":272,"stargazers_count":25,"open_issues_count":1,"forks_count":8,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-09T07:59:13.143Z","etag":null,"topics":["angularjs","filereader","reader"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SparrowJang.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-03-08T07:30:45.000Z","updated_at":"2019-08-13T15:37:12.000Z","dependencies_parsed_at":"2022-08-03T00:31:22.203Z","dependency_job_id":null,"html_url":"https://github.com/SparrowJang/ngFileReader","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SparrowJang%2FngFileReader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SparrowJang%2FngFileReader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SparrowJang%2FngFileReader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SparrowJang%2FngFileReader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SparrowJang","download_url":"https://codeload.github.com/SparrowJang/ngFileReader/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248509351,"owners_count":21115996,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angularjs","filereader","reader"],"created_at":"2024-11-14T23:16:28.693Z","updated_at":"2025-04-12T02:51:25.182Z","avatar_url":"https://github.com/SparrowJang.png","language":"JavaScript","readme":"ngFileReader\n=============\n\n![demo image](/images/screenprint.png)\n\nThis is file reader component on angular.\n\n## LiveDemo\n\n[demo](http://www.sparrowjang.com/ngFileReader/example/index.html)\n\n## Support\n\n* IE8+\n* chrome\n* firefox\n\n\n## Dependency\n\n* angularjs\n* jQuery\n* [FileReader](https://github.com/Jahdrien/FileReader)\n\nYou need load **jQuery** and **FileReader** if browser is not support `FileReader`.\n\nAnd The base64 size only limit 32kb if you use base64 to set image on IE8.\n\nYou also use other [FileReader](https://github.com/Phlow2001/FileReader) version,if you don't want to use `fixed` position by flash.\n\n## Install\n\n```bash\nbower install ngFileReader\n```\n\nor\n\n```bash\nnpm install ngFileReader\n```\n\n## Usage\n\nSet some attrs of element.\n\n```html\n\u003cdiv ng-file-reader on-readed=\"onReaded( event, file )\" read-method=\"readMethod\"  multiple\u003e\u003c/div\u003e\n\nsize:{{file.size | fileSize}}\n\n\u003cimg ng-src=\"{{img}}\"\u003e\n```\n\nSet a reader method.\n\n```js\n$scope.readMethod = \"readAsDataURL\";\n```\n\nAdd a `on-readed` callback to set file size and img data.\n\n```js\n$scope.onReaded = function( e, file ){\n\n  $scope.img = e.target.result;\n  $scope.file = file;\n};\n```\n\nYou are able to follow this If you use browserfiy.\n\n```js\nvar app = angular.module('myApp', [require('ngFileReader')]);\n```\n\n## Attribute\n\n### filereader\nThis is `swf` path, if you use ie8 ~ ie9.\n\n### multiple\nInput multiple property.\n\n### debug-mode\nUse `swf` only.\n\n**ex:**\n\nSet the attr on tag.\n\n```\ndebug-mode=\"true\"\n```\n\n### accept\naccept file extensions.\n\n##Parameter\n\n### read-method\n\nThis is file reader method,when you selected file to call `read-method` method.\n\n**ex:** `readAsDataURL`、`readAsText`、`readAsBinaryString`\n\nSet the attr.\n\n```js\nread-method=\"readMethod\"\n```\n\nSet a string value.\n\n```js\n$scope.readMethod = \"readAsDataURL\"\n```\n\n## Event\n\n### on-selected `Event`\nIt will trigger this event if you has selected.\n\n### on-readed `Event`\nIt will trigger this event When the selected file has readed by file reader.\n\n## Filter\n\n### fileSize\n\nTransfer file size from number to unit.\n\n```html\n\u003c!-- 1048576 =\u003e 1 m --\u003e\n{{file.size | fileSize}}\n```\n\nYou can write this if you need round off to the 2nd decimal place.\n\n```html\n{{file.size | fileSize:2}}\n```\n\n## Run\n \nrun a server:\n\n```bash\ngrunt server\n```\n \nFinally,open your brower,enter [http://localhost:3000/example/index.html](http://localhost/example/index.html).\n\n\n## Minification\n\nJust run `npm install` to install dependencies. Then run `grunt` for minification.\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsparrowjang%2Fngfilereader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsparrowjang%2Fngfilereader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsparrowjang%2Fngfilereader/lists"}