美文网首页Angular
表单form中input组件设置disable未生效 - Ang

表单form中input组件设置disable未生效 - Ang

作者: survivorsfyh | 来源:发表于2021-11-23 11:04 被阅读0次

    当 input 与表单 form 的相结合使用的时候,如果为 input 设置 [disabled]="false" 的属性时发现未能生效;
    日志中会抛出如下警告并提供一种方式;

    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)
          });
    

    另外可以通过不同的事件中单独控制,具体如下:

    // 可编辑
    this.scoreTableForm.controls.scoreName.enable();
    // 不可编辑
    this.scoreTableForm.controls.scoreName.disable();
    

    以上两种方式均可实现其相同的效果,根据实际应用场景自行选择即可.


    以上便是此次分享的全部内容,希望能对大家有所帮助!

    相关文章

      网友评论

        本文标题:表单form中input组件设置disable未生效 - Ang

        本文链接:https://www.haomeiwen.com/subject/qxhwtrtx.html