Désactivé entrée de validation de formulaire dynamique

J'ai un formulaire dynamique (pour l'exemple, à l'aide angulaire.io forme dynamique vivent exemple plunkr) et je veux désactiver la saisie de ce formulaire, à l'affichage en lecture seule de l'information.

J'ai donc décidé d'ajouter disabled attribut à la question du modèle:

export class QuestionBase<T>{
  value: T;
  key: string;
  label: string;
  required: boolean;
  order: number;
  controlType: string;
  disabled?:boolean;

  constructor(options: {
      value?: T,
      key?: string,
      label?: string,
      required?: boolean,
      order?: number,
      controlType?: string,
      disabled?:boolean
    } = {}) {
    this.value = options.value;
    this.key = options.key || '';
    this.label = options.label || '';
    this.required = !!options.required;
    this.order = options.order === undefined ? 1 : options.order;
    this.controlType = options.controlType || '';
    this.disabled = options.disabled || false;
  }
}

Puis-je lier handicapés à l'entrée:

<input *ngSwitchCase="'textbox'" [disabled]="question.disabled" [formControlName]="question.key"
            [id]="question.key" [type]="question.type">

Je reçois un avertissement, et l'entrée n'est pas désactivé:

It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true
      when you set up this control in your component class, the disabled attribute will actually be set in the DOM for
      you. We recommend using this approach to avoid 'changed after checked' errors.

      Example: 
      form = new FormGroup({
        first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
        last: new FormControl('Drew', Validators.required)
      });

Donc j'ai fait comme c'est écrit dans l'avertissement et j'ai un problème, validateur semble pas comme le champ désactivé, même si c'est pas marqué comme requis.

Voici ce que j'ai changé les nouvelles QuestionControlService classe:

@Injectable()
export class QuestionControlService {
  constructor() { }

  toFormGroup(questions: QuestionBase<any>[] ) {
    let group: any = {};

    questions.forEach(question => {
      group[question.key] = question.required ? new FormControl({value: question.value || '', disabled: question.disabled}, Validators.required)
                                              : new FormControl({value: question.value || '', disabled: question.disabled});
    });
    return new FormGroup(group);
  }
}

Problème

La disabled test champ est désactivé, mais non valides, ce qui ne devrait pas être possible car il n'a pas été modifié.

Plunkr pour mon problème: http://plnkr.co/edit/qSDnD2xWWUwafyToDNX1?p=preview

OriginalL'auteur Supamiu | 2016-09-07