Question

我是角度2的新手我有一个页面，其中包含一个从服务驱动的选择菜单，当选择一个项目我得到完整对象，这个对象包含我需要将这个孩子绑定到ng2智能表的子对象，我该怎么做

这是我的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

我需要在Object对象中获取类型列表以将其绑定到表中，

先谢谢！

Answer 1

我在调用onChangeObj

时找到了它

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

将服务中的嵌套对象绑定到角度为2的ng2-smart表

1 个答案: