значение элемента управления формы флажка ложно, но отображается верно

Question

У меня есть элемент управления формой, который получает свое значение в моем методе initForm. «Запись» - это вход, и я получаю правильное значение для ngOnInit - по умолчанию оно ложно. проблема в том, что мой флажок «блокировка» установлен, даже если значение ложно. Я не понимаю, почему это происходит

  ngOnInit(): void {
    this.initForm();
    console.log(this.record.lock)
  }

initForm() {
    this.form = this.fb.group({
    lock: [
              {value: this.record.lock}]
        });
}

  get lock(): AbstractControl {
    return this.form.get('lock');
  }

 <div class="row ">
        <div class="col-md-12 text-right">
          <div class="form-group">
            <div class="mr-0 pretty p-svg p-curve">
              <input type="checkbox" id="lock-vendor-booth" 
                     formControlName="lock"/>
              <div class="state p-danger">
                  <label>Lock</label>
              </div>
          </div>
          </div>
        </div>
      </div>

Answer 1

Определите группу следующим образом:

this.form = this.fb.group({
  lock: [this.record.lock]
});

Я создал рабочий stackblitz .

Answer 2

Попробуйте объявить элемент управления формой, как показано ниже

this.form = this.fb.group({
    lock: new FormControl(this.record.lock, []);
}