2017-07-28 98 views
0

我正在探索帶有主/細節設置的新數據表。我可以填充來自Firebase的數據,但我試圖在其中一列中使用按鈕單擊以在另一個視圖或模式窗口中顯示編輯表單。下面的按鈕工作正常,但我在事件參數中捕獲db $ key時遇到了問題。 OOP技術似乎不起作用。我試過了會員。$ key和row。$ key。密鑰顯示在下面的第二列,因此它住在模板上。我沒有在模板中可以看到這個DataSource。想法?角度材料2數據表:在模板中捕獲屬性?

<ng-container cdkColumnDef="edit"> 
    <md-header-cell *cdkHeaderCellDef> Edit </md-header-cell> 
    <md-cell *cdkCellDef="let row"> <button class="badge" 
      (click)="goToDetailPage(member.$key)">Edit</button> </md-cell> 
    </ng-container> 

    <!-- key Column --> 
    <ng-container cdkColumnDef="key"> 
    <md-header-cell *cdkHeaderCellDef> Key </md-header-cell> 
    <md-cell *cdkCellDef="let row"> {{row.$key}} </md-cell> // This displays the db key. 
    </ng-container> 

回答

0

我制定了一個簡單的解決方案。問題是我不明白AM2數據表中的這一行數據。我的頭仍然是傳統的object.property模式。

這是master-detail可以如何與AM2數據表一起使用的。從下面的第二列中獲取模板變量並將其作爲單擊參數插入。它通過關鍵看你想如任何功能:

goToDetailPage(selectedMemberKey) { 
    console.log('selectedMember: ', selectedMemberKey); 
    this.router.navigate(['/admin/membersAdmin/editMember', selectedMemberKey]); 
    }; 

deleteMember(selectedMemberKey) { 
     // Call the confirm dialog component 
     this.confirmService 
      .confirm('Confirm Delete', 'This action is final. Gone forever!') 
      // .do(); 
      .do(res => {if (res === true) { 
       this.membersAdminService.deleteMember(selectedMemberKey); 
      }}) 
      .subscribe(res => this.result = res, err => err); 
    } 

對於HTML模板:

 <!-- Delete/Edit Buttons Column --> 
    <ng-container cdkColumnDef="delete"> 
    <md-header-cell *cdkHeaderCellDef> Delete/Edit </md-header-cell> 
    <md-cell *cdkCellDef="let row"> 
     <button (click)="deleteMember(row.$key)">Delete</button> 
     <button (click)="goToDetailPage(row.$key)">Edit</button> 
    </md-cell> 
    </ng-container> 
+0

你就不能傳遞'row'成'goToDetailPage(行)'?我相信您不需要您的密鑰列 –

+0

Leo Caseiro,我們需要使用以下URL鍵訪問Firebase數據庫中的密鑰:.../editMember/-Koirn5PbcbPbfHRbaWv。我不知道如何使用行數據,名稱,技能標題等來將數據從數據庫導入編輯表單。必須有Firebase API目前似乎沒有的db屬性搜索。不過,我很快就開始進行這樣的搜索,所以也許我會弄清楚。儘管我們可以通過客戶端的名稱屬性進行搜索。 – Preston

+0

對不起,我的意思是,如果你傳遞行,你應該可以訪問你的方法中的'row。$ key'。 –