直接加[disabled]="isDisabled"属性的话,出现报错

根据提示,做如下修改

private isEdit: boolean = true;
private isDisabled = true;
private myForm: FormGroup; private roleParams = {
roleName:'',
items:['全部权限']
} ngOnInit() {
this.routerIonfo.params.subscribe((params: Params) => { // 如果想要获取查询参数中的值例如 /index?id=1 把这一句的params换成queryParams就好了,取的方法和下面一样
  // 这里是从url参数中取参数的方法,获取的是后面的值如 /page/0 获取的是参数值0
this.isEdit = Number(params['id']) !== 0; // 0:添加,!0编辑
this.roleParams.roleName = params['id'];
});
this.createOrEdit();
this.creatForm();
} createOrEdit(){
if(this.isEdit){ // 如果是编辑的时候,就禁用掉该输入框
this.isDisabled = true;
return;
}
this.isDisabled = false;
this.creatForm();
} // 在初始化表单的时候设置表单中input的属性值,禁用的话 disabled:true
creatForm() {
this.myForm = this.fb.group({
roleName:[{ value:this.roleParams.roleName,disabled:this.isDisabled}]
});
}
<!--双向绑定,控制输入框的是否禁用属性-->
<input class="text-big" type="text" [(ngModel)]="roleParams.roleName" formControlName="roleName">

angular4 form 表单中 input输入框的disabled属性的更多相关文章

  1. angular2+ form 表单中 input输入框的disabled属性设置无效

    最近项目中遇到一个表单input设置disabled问题,直接赋值angular原生的[disabled]=“isDisabled”无效,浏览器警告信息: 无奈,只能按照控制台提示修改: 问题解决

  2. 2022年form表单中input控件最详细总结

    语法 <input type="" name="" id="" value="" placeholder=&quo ...

  3. Angular中form表单中input自动响应回车事件无效

    环境:angular.js 问题:当你在input框中输入搜索信息,然后回车键,信息消失而且也没有执行查询??? 原因:组合查询的代码不是<button ng-click="ch()& ...

  4. jquery自动去除form表单中input框前后的空格

    1. 2. <script type="text/javascript"> $(document).ready(function() { $('#searchform ...

  5. layui form表单 input输入框获取焦点后 阻止Enter回车自动提交

    最简单的解决办法,不影响其他操作,给提交按钮增加 type="button" 属性 完美解决 <button type="button" class=&q ...

  6. form表单中只有一个input时,按回车键后表单自动提交(form表单的一个小坑)

    form中只有一个input按回车键表单会自动提交 在一个form表单中,若只有一个input,按回车键表单会自动提交,但是当表单中存在多个input时,按回车键不会执行任何操作,这是form表单的一 ...

  7. Form 表单中的Input元素回车时不保存表单

    在Form表单中如果直接在Input元素里敲回车键,那么默认将提交表单,可以通过keydown事件取消默认此操作 $("form").live('keydown',function ...

  8. form表单中的input有哪些类型

    form表单中的input有哪些类型 1.button <input type="button"/> 2.checkbox <input type="c ...

  9. form表单中经常用到的禁用获取值问题

    <input name="country" id="country" size=12 value="disabled提交时得不到该值 " ...

随机推荐

  1. uploadify onSelect

    uploadify onSelect [return false]停止选择 $("#fileEleId").uploadify({ 'width': _option.width, ...

  2. ECN

    ECN是工程变更管理,主要用来管理BOM的生效日期,及记录BOM的更改内容:在SAP系统中,需先创建ECN更改号码,凭ECN号码去更改管理BOM

  3. 开源项目AndroidUtil-採用Fragment实现TabHost

    原文出自:方杰|http://fangjie.sinaapp.com/?p=141 转载请注明出处 学习Android也有一段时间了.感觉大部分的Android应用都有非常多类似的组件,所以就打算做了 ...

  4. android BaseAdapter getView 理解

    ListView是安卓中很经常使用的一个控件. 安卓设计使用Adapter来对ListView进行管理. 可是系统提供的Adapter无法满足一些复杂的显示情况,这个时候我们就须要使用BaseAdap ...

  5. CentOS开机的时候卡在进度条一直进不去 F5(是关键)

    这看不出开机启动卡在哪里,只好重启按住"e"键,进入启动菜单: 然后移动到第二项kernel...接着按e进入编辑 去掉rhgb quiet字样 按回车保存回到选择项 按b启动它就 ...

  6. tornado WebSocket详解

    1.什么是WebSocketwebsocket和长轮询的区别是客户端和服务器之间是持久连接的双向通信.协议使用ws://URL格式,但它在是在标准HTTP上实现的. 2.tornado的WebSock ...

  7. angularJs 页面定时刷新

    angularJs 页面定时刷新 页面定时刷新并在页面离开时停止自动刷新 var autoRefresh; //自动刷新 autoRefresh = $interval($scope.loadData ...

  8. 同一个String在使用不同的charset编码的时候equals仍然是返回true吗

    1.对于ASCII字符,是的(只要该charset涵盖了ASCII编码),使用任何charset编码都不会影响equals的判断 2.对于非ASCII字符,不一定.例如同中文字符串"你好&q ...

  9. oracle中floor函数和to_number函数区别

     oracle中floor函数没有值默认是0,number函数没有值默认是空 

  10. ashx上传姿势

    很多情况下网上流传的cer,asa,cdx……等等来上传,其实很多时候是不行的.但是ashx会好一些. PS:其实这个姿势也蛮老了,但是还是相当一大部分站点存在.也是一个姿势所以写博文记住它.免得忘了 ...