Security News
The Dark Side of Open Source
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
ng2-file-size
Advanced tools
Changelog
0.0.4 (2017-10-31)
Readme
Table of Contents generated with DocToc
Angular 2 validation directive for checking <input type="file" />
value to be of the valid size.
Works both with one & multiple files mode.
npm install ng2-file-size --save
npm i ng2-file-size -S
(shortcut)
Attention: in beta version use [ng2FileSizeErrorMsg]
param instead of [fileSizeErrorMsg]
one.
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { Ng2FileSizeModule } from 'ng2-file-size';
@NgModule({
imports: [
// other core modules
FormsModule, // required because of NgModel dependency
Ng2FileSizeModule,
// other app modules
]
})
class MyModule {}
<!--
1. Make it's size restricted by min value (in bytes).
2. The error message is a default one: 'File size is invalid'
-->
<input
type="file"
[ng2FileSize]="{ min: 1024 }"
[(ngModel)]="myFile"
/>
<!--
1. Make it's size restricted by max value (in bytes).
2. The error message is a default one: 'File size is invalid'
-->
<input
type="file"
[ng2FileSize]="{ max: 1024 }"
[(ngModel)]="myFile"
/>
<!--
1. Make it's size restricted by min & max values (in bytes).
2. The error message is customized to 'File size must be less that 1mb and more that 1kb!'
-->
<input
type="file"
[ng2FileSize]="{ min: 1024, max: 1024 * 1024 }"
[fileSizeErrorMsg]="'File size must be less that 1mb and more that 1kb!'"
[(ngModel)]="myFile"
/>
<!--
1. Make it's size restricted by dynamic values (in bytes).
2. The error message is customized dynamically
-->
<input
type="file"
[ng2FileSize]="fileSizeRestrictions"
[fileSizeErrorMsg]="customErrorMessage"
[(ngModel)]="myFile"
/>
See it here.
I express my gratitude to the valor-software team. This project structure is based on their ng2-file-upload solution, their tslint configuration and npm submodules manager.
Clone/fork it
In ./src
directory you can find the directive sources & unit tests, in the ./demo
one - the files for Github Pages demo.
Use next npm scripts for development (they use angular-cli and ngm-cli):
3.1. npm start
serves with ng serve
command;
3.2. npm build
- created ./dist
directory in the end;
3.3 npm test
- runs unit tests with ng test
using Karma and Angular 2 testing tools.
3.4 npm run e2e
- runs e2e tests using Protractor and Selenium Webdriver.
FAQs
Angular input file size directive
The npm package ng2-file-size receives a total of 190 weekly downloads. As such, ng2-file-size popularity was classified as not popular.
We found that ng2-file-size demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.