search

hodgepodgers / ng-intl-tel-input

AngularJS 1.4.x module implementing intl-tel-input (https://github.com/Bluefieldscom/intl-tel-input)
MIT License
110 stars 111 forks source link

Util file `bower_components/intl-tel-input/build/js/utils.js` not installed with bower #94

Open Hendler opened 7 years ago

Hendler commented 7 years ago

With jQuery 3.1.1, first using ng-intl-tel-input 1.4.0 and then 2.0.0 the error is 

intlTelInputUtils is not defined. Formatting and validation will not work.

Error is the same with "intl-tel-input": "~9.0.14" and11.0.4

Hendler commented 7 years ago

When working, bower had installed into index.html bower_components/intl-tel-input/lib/libphonenumber/build/utils.js - which is now removed. I've manually added the new file location bower_components/intl-tel-input/build/js/utils.js which fixes the issue.

Hendler commented 7 years ago

Going to file this with intl-tel-input in case it's an issue there.

zymr-keshav commented 7 years ago

same issue with me but i can not add bower files manually as using gulp to inject the bower files. what is the solution?

rivertam commented 7 years ago

To be fair, it seems to be in the hundreds of kilobytes. Maybe not worth it, at least not for my usecase. That said, this library is next to useless without it so it should definitely be bundled.

zymr-keshav commented 7 years ago

Now I am using international-phone-number along with this intl-tel-input library which solve my issue , the only extra thing is you need to copy flags.png in your images folder and add custom style for that like this 

.iti-flag {
    background: url('../assets/images/flags.png') no-repeat 0px 0px;
}
cwadrupldijjit commented 7 years ago

I'm seeming to have (at least) a similar issue, where it seems like it doesn't load the script, or the script comes and is executed, but it is failing to notice it.

I've initialized the directive like so:

ngIntlTelInputProvider.set({
    autoHideDialCode: true,
    nationalMode: false,
    utilsScript: "/bower_components/intl-tel-input/build/js/utils.js",
});

It's pointing to the right place for the utils file, and (at least to a certain extent), it seems like some validation is happening, but it's still giving the warning in the console intlTelInputUtils is not defined. Formatting and validation will not work.

Looking at the Network tab, I see the utils.js file loading, and it's loading with the right file. The directive doesn't seem to notice it, though.

Is there a service that goes along with this that I can try using the loadScript method that the plugin uses instead?