2016-11-09 64 views
0

我是angular 2的新手 我有一個包含從服務驅動的選擇菜單的頁面,當選擇一個項目時我獲得Full對象,此對象包含子對象,我需要這個孩子綁定到NG2智能表,我怎麼能做到這一點將服務中的嵌套對象綁定到角度爲2的ng2-smart表中

這是我type.html

<div class="widgets"> 
<div class="form-group"> 
    <label for="exampleSelect1">Types</label> 
    <select [ngModel]="selectedObj" (ngModelChange)="onChangeObj($event)" name="sel3" class="form-control" id="exampleSelect1"> 
    <option [ngValue]="obj" *ngFor="let obj of objects">{{ obj.objectName }}</option> 

    </select> 
</div> 

<div class="row"> 
    <ba-card title="Types" baCardClass="with-scroll"> 
     <ng2-smart-table class='form-control' [settings]="settings" [source]="source" (deleteConfirm)="onDeleteConfirm($event)"></ng2-smart-table> 

    </ba-card> 
    </div> 

</div> 

,這是我type.component.ts

import {Component, ViewEncapsulation} from '@angular/core'; 

import { CustomerTypeService } from './customerType.service'; 
import { LocalDataSource } from 'ng2-smart-table'; 
import {TypeService} from './type.service'; 



@Component({ 
    selector: 'basic-tables', 
    encapsulation: ViewEncapsulation.None, 
    styles: [require('./type.scss')], 
    template: require('./type.html'), 
    providers: [TypeService], 

}) 
export class Type { 

    query: string = ''; 





    settings = { 
    add: { 
     addButtonContent: '<i class="ion-ios-plus-outline"></i>', 
     createButtonContent: '<i class="ion-checkmark"></i>', 
     cancelButtonContent: '<i class="ion-close"></i>', 
    }, 
    edit: { 
     editButtonContent: '<i class="ion-edit"></i>', 
     saveButtonContent: '<i class="ion-checkmark"></i>', 
     cancelButtonContent: '<i class="ion-close"></i>', 
    }, 
    delete: { 
     deleteButtonContent: '<i class="ion-trash-a"></i>', 
     confirmDelete: true 
    }, 
    columns: { 

     CustomerType: { 
     title: 'Type Name', 
     type: 'string' 
     } 

    } 
    }; 

    source: LocalDataSource = new LocalDataSource(); 

    public objects: Array<any> = new Array<any>(); 
    public type: Array<any> = new Array<any>(); 
    public id : number; 
     public objectsNum: number = 0; 


    constructor(protected _typeService: TypeService) { 
    this._typeService.getObject().subscribe((res) => { 
     this.objects = res; 

     this.objectsNum = (res) ? res.length : 0; 
    }, error => { 
     alert(error); 
    }); 
    } 
     selectedObj = this.objects; 
     onChangeObj(newObj) { 
    console.log(newObj); 
     this.source.load(this.selectedObj) 

     } 


    onDeleteConfirm(event): void { 
    if (window.confirm('Are you sure you want to delete?')) { 
     event.confirm.resolve(); 
    } else { 
     event.confirm.reject(); 
    } 
    } 
} 

所選對象結構像

object strucure

我需要類型列表中對象的對象將其綁定表中,

在此先感謝!

回答

1

我發現它調用onChangeObj

onChangeObj(newObj) { 
    console.log(newObj); 
     this.source.load(newObj.type); 
}