带ControlValueAccessor测试的Angular 2（4）组件

Question

我想测试实现ControlValueAccessor接口的组件是否允许在我的自定义组件中使用[(ngModel)]，但问题是通常的输入是正确的，但ngModel-未定义。下面是代码示例：

@Component({
  template: `
    <custom-component
      [usualInput]="usualInput"
      [(ngModel)]="modelValue"
    ></custom-component>`
})

class TestHostComponent {
  usualInput: number = 1;
  modelValue: number = 2;
}

describe('Component test', () => {
  let component: TestHostComponent;
  let fixture: ComponentFixture<TestHostComponent>;
  let de: DebugElement;
  let customComponent: DebugElement;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        CustomComponent,
      ],
      schemas: [NO_ERRORS_SCHEMA],
    }).compileComponents();
  }));
});

因此，我希望customComponent中的usualInput Input（）值等于1（确实如此），ngModel值等于2，但ngModel=未定义，调试后我知道ControlValueAccessor writeValue方法不会在测试环境中调用（但它对浏览器是正确的）。那我该怎么修好它呢？

Answer 1

在ControlValueAccessor组件中，您不能访问NGModel，除非您插入了它并采取了一些技巧来避免循环依赖。

ControlValueAccessor具有WriteValue方法，该方法在更新控件时从控件接收值-如果需要，可以将该值存储在组件中，然后测试它。