Question

我想在使用Typescript的角度项目中使用Google libphonenumber。我在互联网上搜索了很多东西，发现了很多东西，却找不到任何可以达到我目的的东西。

大多数可用内容都以JavaScript形式显示代码。如果我在打字稿中使用相同的代码，它会显示很多错误，例如“无法找到名称要求”或“未找到模块”。请告诉我如何/在哪里/写什么代码。

另外，请告诉我要安装哪个软件包，因为有很多软件包 - libphonenumber，google-libphonenumber，angular-libphonenumber

Answer 1

你可以选择libphonenumber或google-libphonenumber，因为这个库有很多安装量，google-libphonenumber似乎更强大

Answer 2

在处理CommonJS库时，在TypeScript中，就像 google-libphonenumber 一样，我想提出2种解决方法（由我测试，效果很好）

我第一次建议从NPM安装，就像这样：npm install --save google-libphonenumber。

然后在这里我们介绍两种使用方式：

第一种方法

只需直接导入

import libphonenumber from 'google-libphonenumber';
class Something {
    constructor() {//Just example, you can chose any method
        const phoneUtil = libphonenumber.PhoneNumberUtil.getInstance();
        console.log( phoneUtil.getSupportedRegions() );//It should works and give you some output
    }
}

第二种方法

您仍然可以使用Typescript打字，也可以通过npm install --save-dev @types/google-libphonenumber使用现有的打字稿。

由于您说过使用的是Angular，因此可以声明键入刚刚安装在src/tsconfig.app.json上（我使用的是Angular版本7）。这是我做的一个例子：

{
  ...
  "compilerOptions": {
    ...
    "types": [
      "google-libphonenumber"
    ]
  },
  ...
}

然后，您可以像平常一样以Typescript“键入”方式导入它，如下所示：

import { PhoneNumberUtil } from 'google-libphonenumber';

class Something {
    constructor() {//Just example, you can chose any method
        const phoneUtil: PhoneNumberUtil = PhoneNumberUtil.getInstance();
        console.log( phoneUtil.getSupportedRegions() );//It should works and give you some output
    }
}

Answer 3

使用ng2-tel-input。唯一的lib稳定于angular 7。 ngx-tel-input具有更多功能。但这与ang7有关。

从here下载

使用示例：

  <input type="text"
ng2TelInput
[ng2TelInputOptions]="{initialCountry: 'UK'}"
(hasError)="hasError($event)"
(countryChange)="onCountryChange($event)" />

如何在Typescript中使用Google libphonenumber？

3 个答案:

第一种方法

第二种方法