Angular 7: TypeError: Cannot read properties of undefined (reading 'substr')

Question

我有 angular 7.1.4 应用程序编译成功但是当我在浏览器中打开控制台时我看到这个错误：

ERROR TypeError: Cannot read properties of undefined (reading 'substr')           core.js:14597 
at TruncatePipe.push../src/app/_services/truncate.ts.TruncatePipe.transform (truncate.ts:11:21)

如果我理解正确，那么我的 truncate.ts 文件中的波纹管代码有问题。这是我的代码：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'truncate'
})
export class TruncatePipe implements PipeTransform {
  transform(value: string, limit = 25, completeWords = false, ellipsis = '...') {
    if (completeWords) {
      limit = value.substr(0, limit).lastIndexOf(' ');
    }
    return `${value.substr(0, limit)}${ellipsis}`;
  }
}

我不确定这里有什么问题？有什么想法可能是错的吗？

Answer 1

以上加一个条件

if(value){
....your code
}

Answer 2

Indraraj26 指出您应该在执行前将代码包装在 check-value 中。

如果 value 永远为 null，则不能获取它的子字符串，因此为了避免这种情况，您应该检查 value != null 或 ""。您可以使用

在 Angular 中简单地做到这一点

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'truncate'
})
export class TruncatePipe implements PipeTransform {
  transform(value: string, limit = 25, completeWords = false, ellipsis = '...') {
    if(value){
       if (completeWords) {
          limit = value.substr(0, limit).lastIndexOf(' ');
       }
       return `${value.substr(0, limit)}${ellipsis}`;
    }
  }
}

对于 null，if-statement 将为假，并防止您的代码运行并因此失败。

Answer 3

在使用 value 之前你应该检查它是否 undefined 看看下面的例子：

函数：


public validateText(text: string) {
  return text;
}

现在调用这个函数会报错：

const text = 'just an example' as string | undefined; 

validateText(text);

错误：

TS2322: Type 'string | undefined' is not assignable to type 'string'. Type 'undefined' is not assignable to type 'string'.

在你的情况下，你应该在调用函数之前检查值，或者在 substr 之前检查函数内部的值，或者像这样更具体：

if (typeof value === 'string') {
//Your code 
}

// OR in short 

if (value) {
//Your code 
}

Angular 7: TypeError: Cannot read properties of undefined (reading 'substr')

Angular 7: TypeError: Cannot read properties of undefined (reading 'substr')

javascript

typescript

angular

angular7