Question

我试图使用https://www.npmjs.com/package/ngx-intl-tel-input，我有我的module.ts：

import {NgxIntlTelInputModule} from "ngx-intl-tel-input";
import {BsDropdownModule} from "ngx-bootstrap";
@NgModule({
    imports: [
        NgxIntlTelInputModule,
        BsDropdownModule.forRoot()
    ],

和html代码：

<h1>
        {{phone_number}}
</h1>
<ngx-intl-tel-input [(value)]="phone_number"></ngx-intl-tel-input>

但是我一直收到以下错误：

错误错误：未捕获（在承诺中）：错误： StaticInjectorError（...）[BsDropdownDirective - ＆gt; ComponentLoaderFactory]：StaticInjectorError（平台：核心）[BsDropdownDirective - ＆gt; ComponentLoaderFactory]： NullInjectorError：没有ComponentLoaderFactory的提供者！错误：StaticInjectorError（...）[BsDropdownDirective - ＆gt; ComponentLoaderFactory]：StaticInjectorError（平台：核心）[BsDropdownDirective - ＆gt; ComponentLoaderFactory]：

Answer 1

我设法通过转到以下目录中的index.js文件来修复它

node_modules\ngx-intl-tel-input

以及本节

NgxIntlTelInputModule.decorators = [{
    type: NgModule,
    args: [{ imports: [ CommonModule, FormsModule, BsDropdownModule ], ...

我将 BsDropdownModule 更改为 BsDropdownModule.forRoot()

P.S进行更改后，别忘了再次致电ng serve。

这当然是一个补丁，应该仍然在此软件包中进行修复，否则，一旦更新了软件包，更改将被覆盖。

Answer 2

您可以使用此插件-intl-input-phone。

npm i intl-input-phone

See the NPM link for more information npm

GitHub Link

Demo Link 1

Demo Link 2

Answer 3

希望这有帮助

在App.module中

import { NgxIntlTelInputModule } from 'ngx-intl-tel-input';
imports: [

    NgxIntlTelInputModule
]

在您的组件html中：

  <ngx-intl-tel-input [preferredCountries]="['es']" [enableAutoCountrySelect]="true" name="phoneNumber"
              formControlName="phoneNumber" [(ngModel)]="phoneNumber"></ngx-intl-tel-input>

有关更多信息，这里是演示链接： https://stackblitz.com/edit/ngx-intl-tel-input-demo

Angular 5 ngx-intl-tel-input错误

3 个答案: