select-phone v0.0.8
country-picker
A plugin for entering and validating international telephone numbers. It adds a flag dropdown to any input, detects the user's country, displays a relevant placeholder and provides formatting/validation methods.
This is a template for building your own reusable Angular6 module using TypeScript.
Browser Compatibility
Chrome | FF | Safari | IE | Chrome Android | Mobile Safari | IE Mob |
---|---|---|---|---|---|---|
✓ | ✓ | ✓ | 11 | ✓ | ✓ | ✓ |
Installation
If you'd like to test this package,install it with npm run npm i select-phone
Usage
app.module.ts
// Import
import {SelectPhoneModule} from 'select-phone';
@NgModule({
imports: [
BrowserModule,
SelectPhoneModule // put module in imports
],
})
home.html
<lib-select-phone></lib-select-phone>
Update angular-cli.json file for older Angular project(2,4,5) and angular.json for Angular6
{ "glob": "*/", "input": "../projects/select-phone/assets/flags", "output": "./assets/" }
// add above line into assets Array in your file, for example
"assets": [
"src/favicon.ico",
"src/assets",
{ "glob": "**/*", "input": "node_modules/select-phone/assets/", "output": "./assets/" } //put here
]
// if it doesn't work then just stop running your project and run again.
Usage For Ionic App
Step 1 - Install the plugin
Step 2 - Import module in the app.module.ts file.
app.module.ts
// Import
import {SelectPhoneModule} from 'select-phone';
@NgModule({
imports: [
BrowserModule,
SelectPhoneModule // put module in imports
],
})
Step 3 - Include it in any component using below component code
home.html
<lib-select-phone></lib-select-phone>
Step 4 - Create folder named config and create file namedcopy.config.js inside the config folder
Step 5- Copy and paste below code into that file
copy.config.js
module.exports = {
copyAssets: {
src: ['{{ROOT}}/node_modules/select-phone/assets/**/*'],
dest: '{{WWW}}/assets/'
}
}
Step 6 - Update package.json file to include copy.config.js file.
package.json
"config": {
"ionic_copy":"./config/copy.config.js"
}
Step 7 - Restart your project using ionic serve or rebuild your project.