如何以斜角显示snakbar中来自对象的数据

时间:2019-01-30 11:59:51

标签: javascript angular typescript angular-material

我有一个snakbar,它可以从Web服务获取通知并显示有关作业执行成功还是失败的信息。

解析Json的代码:

    this.messageService.messageReceived$.subscribe(data => {

        this.snakbar.statusBar("Platform job Completed - " + data, "Info");
        let webService: WebService = JSON.parse(data);
        console.log(webService.message);
        console.log(webService.executionId);
        console.log(webService.code);
        this.spinner.hide();
        this.selectedIndex = 1;
}

我已经创建了一个解析Json的接口

interface WebService {
jobId: string,
executionId: string,
code: number,
message: string,
data: string
}

使用console.log我可以在console中查看数据。但是我想在snakbar中显示消息。 现在我得到'Platform job Completed - [Object][Object]' 我想要在snakbar 'Platform job Completed - Success/Failure Info"'

中这样的东西

我该如何实现?

1 个答案:

答案 0 :(得分:1)

首先将订阅的值分配给某个变量。

this.data = data;

然后,尝试从数据中获取消息值,如下所示。

this.snakbar.statusBar("Platform job Completed - " + this.data.message, "Info");

完整代码

const project = JSON.parse(this.dataService.getObject("project"));
    if (project != null) {
        this.globalAppSateService.onMessage(project);
        this.project = project;
    }
    this.messageService.messageReceived$.subscribe(data => {
        this.data = data; // assigning data to reuse
        this.snakbar.statusBar("Platform job Completed - " + this.data.message, "Info");
        let webService: WebService = JSON.parse(data);
        console.log(webService.message);
        console.log(webService.executionId);
        console.log(webService.code);
        this.spinner.hide();
        this.selectedIndex = 1;
}