Angularfire从查找列表

删除对象（我很新的角度和相当新的编码，所以请原谅我，如果我的问题似乎没那么亮。）Angularfire从查找列表

我的项目和任务列表。我可以将任务添加到项目中并在项目组件中的表中迭代它们（通过使用非规格化查找表）。但我无法弄清楚如何使用projectTasks表中每行迭代的按钮从项目中删除它们。

Plnkr：http://plnkr.co/edit/BSAYL6PfLLCQ7xXWIo2N?p=info

项目接口：

export interface Project { 
$key: string; 
name: string; 
projectTasks: { 
    [key: string]: { 
     name: string; 
     assignedTo?: string; 
     dueDate?: String; 
     estTime?: String; 
    } 
};}

任务界面：

export interface Task { 
$key: string; 
name: string; 
assignedTo?: string; 
dueDate?: string; 
estTime?: string; }

添加任务功能：

//(selectedTask: Task, projectTasks = [];) 
    addTask() { 
    this.project.projectTasks[this.selectedTask.$key] = { 
     name: this.selectedTask.name, 
     assignedTo: this.selectedTask.assignedTo ? this.selectedTask.assignedTo : 'N/A', 
     dueDate: this.selectedTask.dueDate ? this.selectedTask.dueDate : 'N/A' , 
     estTime: this.selectedTask.estTime ? this.selectedTask.estTime : 'N/A' , 
    }; 
    this.setProjectTasks();

设置项目任务功能：

setProjectTasks() { 
    if (this.project.projectTasks == null) { 
     this.project.projectTasks = {}; 
    } 
    this.projectTasks = Object.keys(this.project.projectTasks) 
     .map(key => this.project.projectTasks[key]); 
}

删除任务功能：（删除整个任务节点）

removeTask(task) { 
    this.taskService.removeTask(task) 
    .then(_ => this.router.navigate([`ww/task-list`])); 
}

任务服务删除任务：

removeTask(task) { 
    return this 
     .tasks$ 
     .remove(task.$key) 
     .then(_ => alert('Task Successfully Deleted')) 
     .catch(error => console.log(error));

我可以在下拉迭代分配的任务所显示和我需要找到一个逻辑，使用Remove按钮使用null值更新addedTask，而不必删除实际的任务节点。

<div class="form-group row"> 
<label for="remove-row">Remove Tasks From Project</label> 
<md-select placeholder="Select a Task" [(ngModel)]="selectedTask"> 
<md-option *ngFor="let projectTask of projectTasks" [value]="projectTask"> 
{{projectTask.name}} </md-option> 
</md-select> 
<button class="btn btn-primary" 
(click)="removeProjectTask(projectTask)">Remove From Project</button>

来源

2017-10-07 ReturnTable

'removeProjectTask（TASKNAME：串）{常量taskKey = Object.keys（this.project.projectTasks）.find（密钥=> {返回this.project.projectTasks [键]。名称===此。 '; '删除this.project.projectTasks [taskKey]; this.setProjectTasks（）;}' 正在为我工作。 – ReturnTable

下述溶液一直为从所述查找表中除去的对象。

removeProjectTask(taskName: string) { 
const taskKey = Object.keys(this.project.projectTasks) 
    .find(key => {return this.project.projectTasks[key] 
    .name === this.selectedTask.name ;}); 
delete this.project.projectTasks[taskKey]; 
this.setProjectTasks(); 
}

来源

2017-10-13 19:18:39 ReturnTable

Angularfire从查找列表

回答

相关问题