Asynchronous 离子异步数据传输

底部更新

我试图以*ngs格式显示数据，因为我从一个对象获取的数据是从离子存储异步检索的。现在我的屏幕是空白的

我尝试过多种方法，比如以不同的方式使用异步管道。 有人知道正确的方法吗

下面是正在调用的存储服务方法：

public getFlow(flowId:number){
       return this.storage.get(FLOWS_KEY).then((flows:Map<number,Flow>)=>{
           return flows.get(flowId);
       });
    }
this returns a Promise<Flow>

我的html：

<ion-content padding>
<div *ngIf="(flow | async)">
 <div *ngFor="let col of flow.columns;index as i">
    <h2>{{col}}</h2>
   <div *ngFor="let task of flow.getTasksFromCol(i)">
      <ion-card (swipe)="swipe($event,task)">
          <ion-item>
              <h2>{{task}}</h2>
            <button ion-button item-end clear icon-end> 
                <ion-icon name='more'></ion-icon>
              </button>
            <p>{{task}}</p>
          </ion-item>
        </ion-card>
   </div>
</div>
</div>

<ion-fab right bottom>
  <button ion-fab color="light"><ion-icon name="arrow-dropleft"></ion-icon></button>
  <ion-fab-list side="left">
    <button (click)="createTask()" ion-fab><ion-icon name="add-circle"></ion-icon></button>
    <button ion-fab><ion-icon name="create"></ion-icon></button>
  </ion-fab-list>
</ion-fab>
</ion-content>

我还更新了我的html，但它仍然不起作用：我现在得到错误：

错误类型错误：_co.flow.getTasksFromCol不是函数 at Object.eval[作为updateDirectives]

这很奇怪，因为我的流模型中存在此方法：

import { Task } from "./Task";

export class Flow {
    //PK for 1-n relation with task
    flowId:number;
    projectName:string;
    columns:string[];
    tasks: Map<number,Task>;

   constructor(flowId:number,projectName:string,columns:string[],tasks:Map<number,Task>){
    this.flowId = flowId;
    this.projectName = projectName;
    this.columns = columns;
    this.tasks = tasks;
   }

   public getTasks(){
    return Array.from(this.tasks.values())
}
    public getTasksFromCol(colNumber:number){
        var tasks = new Array<Task>();
        for(let task of Array.from(this.tasks.values())){
            if(task.column == colNumber){
                tasks.push(task)
            }
        }
        return tasks;
    }
}

从“/Task”导入{Task}；
出口类流量{
//与任务的1-n关系的PK
flowId：编号；
projectName:string；
列：字符串[]；
任务：地图；
构造函数（flowId:number，projectName:string，columns:string[]，tasks:Map）{
this.flowId=flowId；
this.projectName=projectName；
this.columns=列；
这个。任务=任务；
}
公共任务（）{
返回数组.from（this.tasks.values（））
}
公共getTasksFromCol（colNumber:number）{
var tasks=新数组（）；
for（让数组的任务从（this.tasks.values（））开始）{
if（task.column==colNumber）{
任务。推送（任务）
}
}
返回任务；
}
}

更新2 我现在将此添加到我的服务中

public getTasksFromCol（flowId:number，colNumber:number）{
返回此.storage.get（FLOWS\u键）。然后（（FLOWS:Map）=>{
变量流：flow=flows.get（flowId）；
var tasks=新数组（）；
for（让数组的任务从（flow.tasks.values（））开始）{
if（task.column==colNumber）{
任务。推送（任务）
}
}
返回任务；
});
}

我只是在我的html页面中调用它吗？我有点卡住了，我发现了你的错误

您已经创建了一个变量

flow:Flow;

this.flow = flow;

您已为该变量赋值

flow:Flow;

this.flow = flow;

现在您需要了解变量包含一些与您所分配的内容相关的值。因此您无法访问flow.getTasksFromCol（）

这就是你面对这个错误的原因

错误类型错误：_co.flow.getTasksFromCol不是Object.eval[作为updateDirectives]上的函数

解决方案：-

只需将这个getTaskFromCol（）方法移动到服务并应用html，如下所示

---

我希望它能起作用。让我们再试一次，如果有任何错误，请告诉我。

您将如何实现这一点？让服务检索流，然后获取想要的任务？现在，我的存储似乎不再工作，数据库被删除，如果我创建流，它就不会进入数据库。发生了一些非常奇怪的事情，loli将该方法添加到我的服务中。我试着在我的html中调用它，但我的应用程序却冻结了。

this.flow = flow;