Question

我已经阅读了很多有关此主题的问答，但没有人符合我的情况

这是我的组件代码的一部分

import { Component, ViewChild } from '@angular/core'
import { Modal } from '../../modal.component'
import { ChargingPoint } from '../../d4c.model'

// Sub-components
import { D4CDevChargingPointsTableComponent } from './d4c.chargingpoints-table.component'
import { D4CDevChargingPointFormComponent } from './d4c.chargingpoints-form.component'
import { D4CDevChargingPointsSearchFormComponent } from './d4c.chargingpoints-search-form.component'

// Data service
import { D4COperationService } from '../../services/d4c.operation.service';

@Component({
  selector: 'd4c-chargingpoints',
  templateUrl: './templates/devices/chargingpoints/d4c.chargingPoints.template.html',
  providers: [D4COperationService]
})
export class D4CDevChargingPointsComponent {

    @ViewChild( D4CDevChargingPointsTableComponent )
    chargingpoints_table: D4CDevChargingPointsTableComponent;

    @ViewChild( D4CDevChargingPointFormComponent )
    chargingpoint_form: D4CDevChargingPointFormComponent;

    @ViewChild( D4CDevChargingPointsSearchFormComponent )
    chargingpoint_search_form: D4CDevChargingPointsSearchFormComponent; 

    @ViewChild( Modal )
    chargingpoint_modal: Modal;

    chargingPoints: ChargingPoint[];

    constructor( private operationService: D4COperationService ) {};

    ngAfterContentInit() {
        this.operationService.getChargingPoints().then( chargingPoints => {
            this.chargingPoints = chargingPoints; 
        });
    }

    ngAfterViewInit() {
        console.log( "ChargingPoint Form: " + this.chargingpoint_form );
    }
...

这是组件模板：

<h1>Estaciones de recarga</h1>

<d4c-chargingpoints-search-form (filter)="filter()" (clean)="cleanFilter()">
</d4c-chargingpoints-search-form>

<d4c-chargingpoints-table
    [chargingPoints]="chargingPoints"
    (onAddButton)="add()"
    (onEditButton)="edit($event)"
    (onRemoveButton)="remove($event)">
</d4c-chargingpoints-table>

<modal>
    <span class="modal-title" >
        Estación de Recarga
    </span>
    <d4c-chargingpoints-form 
        (ok)="formOk()"
        (cancel)="formCancel()"
        class="modal-content">
    </d4c-chargingpoints-form>
</modal>

当我在ngAfterContentInit或ngAfterViewInit停留时，只定义了Modal控件，其他所有控件仍未定义。

正确显示子组件。例如，该表显示了所有已加载的充电点＆＃39;但chargingpoints_table未引用。

我有其他控件具有完全相同的结构，工作正常。我找不到与ViewChild不相同的其他因素，也没有找到原因。

为什么对子组件的引用未定义，如何解决？谢谢你。

角。并非@ViewChild找到所有组件

0 个答案: