Question

过去几天我一直坐在一个问题上。我似乎无法在任何地方获得解决方案。的背景：我有一个typescript类定义如下：

export class Client extends Person {
    claimNumber: string;
    policyNumber: string;
    address: string;
    insuranceCompany: Organisation = new Organisation();

    toString(): string {
        return this.policyNumber
            .concat(this.claimNumber);
    }
}

以上用作驱动角度5模板的模型。在我的组件中，我从远程api＆amp; amp;中获取（使用angular 5 HttpClient ）客户端列表。生成一个html表行。生成表行的LOC是：

<tr *ngFor="let client of clients | filter:searchString"> ... </tr>

上面的

searchString 是绑定到搜索输入标记的属性＆amp; 过滤器 是自定义过滤器管道，定义如下：

export class FilterPipe implements PipeTransform {
    transform(items: Client[], term: string) {               
        if (term == undefined || term === '') return items;
        return items.filter(item =>item.toString().toLocaleLowerCase().includes(term.toLocaleLowerCase()));
    }
}

问题：当我在上面的过滤器管道中检查item.toString（）时，它返回[object Object]而不是由policyNumber和＆amp;组成的字符串。 claimNumber。

研究：我按如下方式调查了这个问题：我按如下方式实例化了Client类：

let c = new Client();
c.policyNumber = 'ababababa';
c.claimNumber = 'aaaaaaa';
console.log('client toString() is => ' + c.toString());

有趣的是，上面的console.log输出：'ababababaaaaaaaa'。

问题：我做错了导致过滤器管道中的item.toString（）返回 [object Object] ，而我实例化的类上的toString（）返回正确的字符串？

Answer 1

如果从WebService（或类似的东西）获取客户端，则只需获取普通json对象。如果您说收到的对象属于Client类型，则typescript会将它们显示为此类型的对象，但仅属性将相同，方法将不会来自{ {1}}类，但来自Client类。

从服务器检索它们后，您可能希望将它们实例化为真正的客户端对象：

Object

您可能更喜欢使用贫血对象，其类型为接口，并使用实用函数将客户端检索为字符串，以避免像您所拥有的那样：

public myServiceMethod() {
    return this.http.get(...).map(plainClients => {
        const realClients: Array<Client> = (plainClients || []).map(plainClient => {
            let realClient = new Client();
            realClient.claimNumber = plainClient.claimNumber;
            realClient.policyNumber = plainClient.policyNumber;
            realClient.address = plainClient.address;
            return realClient;
        });
        return realClients;
    })
}

我并不是说在你的应用程序中使用贫血类，但如果某种类型的对象被传递并且可能会被序列化，那么使用贫血对象可以避免像你所拥有的那样的问题。

Answer 2

找出问题的方法是将方法重命名为内置方法名称，例如toSearchString。将控制台日志添加到过滤器功能中也是值得的，以确保您实际获得clients。你可能实际上得到了一个不同的对象。

覆盖自定义typescript类

2 个答案: