找不到具有未指定名称属性的控件

时间:2018-08-22 16:19:45

标签: angular forms unit-testing karma-jasmine

我的演示文稿和智能组件运行良好,并且formControls可以完美处理,但是它们在我的业力测试中失败了。我检查了绑定,检查了导入,并确保所有名称都对齐,但是我仍然无法弄清楚。 有人知道如何在单元测试模块中解决此问题吗?

智能组件:

WebSocket

哑巴组件:

// ...(imports, yes I imported FormControl from @angular/forms
// my module imports reactive forms

// ...component decorator
    template: '
        <app-dumb
            [satControl]="satControl"
            [chControl]="chControl"
            [recControl]="recControl"
        ><app-dumb>
export class smartComponent {
    satControl = new FormControl('default', [Validators.required]);
    chControl = new FormControl('default', [Validators.required]);
    recControl = new FormControl('default', [Validators.required]);
}

哑组件说明:

    // ...(imports, including FormControl)
    // ... component decorator
       template: `
           <select [formControl]="satControl">
               <option
                    class="hide-select"
                    value="default"
                    disabled
                >
                    pick a satellite
                </option>
                <option
                    // ignore the ng-fors, they do populate from the smart component
                    *ngFor="let sat of sats"
                    [value]="sat"
                    >
                    {{ sat }}
                </option>
               <select [formControl]="chControl">
                   <option
                        class="hide-select"
                        value="default"
                        disabled
                    >
                        pick a channel
                    </option>
                    <option
                        *ngFor="let ch of channels"
                        [value]="ch"
                    >
                        {{ ch }}
                    </option>
                </select>
                <select [formControl]="recControl">
                    <option
                        class="hide-select"
                        value="default"
                        disabled
                    >
                        pick from recent channels
                    </option>
                    <option
                        *ngFor="let recent of recentCh"
                        [value]="recent.value"
                        (click)="recControl.setValue(recent.value)"
                    >
                        {{ recent.name }}
                    </option>
              </select>
       `
export class dumbComponent {

    @Input() satControl: FormControl;
    @Input() chControl: FormControl;
    @Input() recControl: FormControl;
}

这是我的错误的屏幕截图,对于示例代码,我只是重命名了所有内容并简化了组件。请注意,SatFormComponent是聪明的,而SatFormViewComponent是愚蠢的。

enter image description here

0 个答案:

没有答案