字符串类型上不存在 'replaceAll' 属性

Question

字符串类型上不存在 'replaceAll' 属性

162

我想在typescript和angular 10中使用replaceAll。

但是我得到了这个错误：属性'replaceAll'在类型'string'上不存在。

这是我的代码：

let date="1399/06/08"
console.log(date.replaceAll('/', '_'))

输出: 13990608

如何修复我的 TypeScript，以显示此函数？

- behroozbc

1

TypeScript 不能在浏览器中自动添加一个函数。你需要实现链接问题中 Michael D 的回答中提到的替代方法之一。 - Heretic Monkey

8

目前您可以使用 date.split('/').join('_')。虽然您也可以更新到 Chrome85。 - Jai

9

我想在VSCode中使用，但是我遇到了这个错误。 - behroozbc

@behroozbc 你可以尝试使用最新的 TypeScript 版本。 - Jai

14个回答

128

您可以使用RegExp和全局标志解决问题。全局标志使replace在所有出现的情况下运行。

"1399/06/08".replace(/\//g, "_") // "1399_06_08"

- strdr4605

30

这并不能 "解决问题"。这只是另一种替换所有出现的方式。但如果你想继续使用 replaceAll，这并不能解决 OP 的问题。 - bokkie

11

这个问题涉及到 TypeScript 是否兼容 String.replaceAll() 方法，而不是请求解决方法。请您确认一下我的翻译是否符合要求。 - Mohammad Moallemi

4

@bokkie 在我的情况下，这解决了问题。我正在使用React Native，更改编译器选项实际上并不会更新JavaScript，因此这确实是唯一的解决方案。 - ICW

19

来自文档：

截至2020年8月，replaceAll()方法已被Firefox支持，但未被Chrome支持。它将在Chrome 85中提供。

同时，您可以在这里找到多种其他方法。

可能对未来读者有用的屏幕截图：

- ruth

3

如何修复我的 TypeScript 以显示此函数？ - behroozbc

请参见 https://caniuse.com/#feat=mdn-javascript_builtins_string_replaceall - Heretic Monkey

3

据我所知，replaceAll()是来自ES2021规范的。如果最新版本的TS不支持它，除了使用其他方法，你无法做太多事情。 - ruth

9

那是因为TypeScript无法识别比其当前JavaScript版本更新的方法。String.replaceAll() 是在ES2021中定义的。

您需要在tsconfig.json文件的compilerOptions中添加lib。 lib的值必须是以下之一：["ES2021"]，或者具体的字符串类型["ES2021.String"]。

请在tsconfig.json文件中添加以下内容：

{
  ...
  "compilerOptions": {
    "lib": ["ES2021"]
  ...
}

- Axel Lopez

3

这似乎没有消除我的错误。 - Cin88

9

只需使用此功能

    let date="1399/06/08"
    
    console.log(date.split('/').join('_'))

- Mansour Alnasser

这是我解决问题的第一个想法，但我相信有更有效的方法。使用正则表达式似乎是正确的方式。 - Kieran101

1

所提出的问题是“如何修复我的 TypeScript 以显示这个函数？”一个有效的答案显然不是“使用我的函数代替”，尤其是当有一个干净的答案时（修复 ES 版本）:) - mhombach

7

您可以在 Angular 项目的根目录下创建一个文件

myOwnTypes.d.ts

并添加以下代码：

interface String {
    replaceAll(input: string, output : string): any;
}

这将告诉 TypeScript 字符串具有该属性。

现在 replaceAll 在 Chrome 和 Firefox 中得到支持，但最好检查 caniuse 确定它是否符合您的需求。

https://caniuse.com/?search=replaceAll

如果对您有帮助，请点赞支持。我刚刚开始使用这个stackoverflow账号，感谢支持 :)

- David Ricardo Amaya Rojas

4

另一个可能的解决方案：我遇到了这个问题，但是我的tsconfig目标设置为“es2021”。原因是也有一个库被指定了。因此，通过使用lib和target，它覆盖了默认的lib。解决方案是完全删除lib或将其添加到lib选项中。

例如： "compilerOptions":{ ..."target": "ES2021" }

或者

"complierOptions":{ "target": "ES2021", "lib": [ ..., "ES2021.String" ],

- Kman

这对我有用。我还必须确保我的包设置为Node > 15，以及使用nvm的活动Node解释器。 - AvidDabbler

哇，这对我也有用，谢谢！ - undefined

3

如果仍然有人遇到此问题，请将以下内容添加到您的tsconfig.json文件中。

{
    ...,
    "compilerOptions": {
        ...,
        "lib": [
          ...,
          "esnext.string"
        ]
    }
}

- Zethembiso Gwala

2

用正则表达式替换所有内容的简单替代方案。

let subject = '1399/06/08';

let substring = '/';
let replacement = '_';

let newSubject = subject.replace(new RegExp(substring, 'g'), replacement);

console.log(newSubject);

注意，您可以将其制作成一个以子字符串和替换为字符串输入的函数，这是实用的。

我的用例是创建一个Angular "Replace"管道。

- Ismail Hachimi

2

这也可能发生在正确的 `tsconfig` 下，如果文件未被任何地方使用/导入且不是 `tsconfig.files` 的一部分。

- user5480949

这帮助我解决了问题，谢谢。我的问题是在tsconfig.json的includes部分缺少文件。通过添加我的脚本目录来更新includes解决了问题。 - TestWell

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Josef · Accepted Answer

你可以通过修改 tsconfig.json 文件来添加这些类型支持。在 compilerOptions 中的 lib 属性中加入 "ES2021.String"。

你的 tsconfig 文件应该类似于以下内容：

{
    ...,
    "compilerOptions": {
        ...,
        "lib": [
          ...,
          "ES2021.String"
        ]
    }
}

replaceAll 方法定义在 lib.es2021.string.d.ts 中，具体如下：

interface String {
    /**
     * Replace all instances of a substring in a string, using a regular expression or search string.
     * @param searchValue A string to search for.
     * @param replaceValue A string containing the text to replace for every successful match of searchValue in this string.
     */
    replaceAll(searchValue: string | RegExp, replaceValue: string): string;

    /**
     * Replace all instances of a substring in a string, using a regular expression or search string.
     * @param searchValue A string to search for.
     * @param replacer A function that returns the replacement text.
     */
    replaceAll(searchValue: string | RegExp, replacer: (substring: string, ...args: any[]) => string): string;
}