angular4 form 表单中 input输入框的disabled属性
直接加[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属性的更多相关文章
- angular2+ form 表单中 input输入框的disabled属性设置无效
最近项目中遇到一个表单input设置disabled问题,直接赋值angular原生的[disabled]=“isDisabled”无效,浏览器警告信息: 无奈,只能按照控制台提示修改: 问题解决
- 2022年form表单中input控件最详细总结
语法 <input type="" name="" id="" value="" placeholder=&quo ...
- Angular中form表单中input自动响应回车事件无效
环境:angular.js 问题:当你在input框中输入搜索信息,然后回车键,信息消失而且也没有执行查询??? 原因:组合查询的代码不是<button ng-click="ch()& ...
- jquery自动去除form表单中input框前后的空格
1. 2. <script type="text/javascript"> $(document).ready(function() { $('#searchform ...
- layui form表单 input输入框获取焦点后 阻止Enter回车自动提交
最简单的解决办法,不影响其他操作,给提交按钮增加 type="button" 属性 完美解决 <button type="button" class=&q ...
- form表单中只有一个input时,按回车键后表单自动提交(form表单的一个小坑)
form中只有一个input按回车键表单会自动提交 在一个form表单中,若只有一个input,按回车键表单会自动提交,但是当表单中存在多个input时,按回车键不会执行任何操作,这是form表单的一 ...
- Form 表单中的Input元素回车时不保存表单
在Form表单中如果直接在Input元素里敲回车键,那么默认将提交表单,可以通过keydown事件取消默认此操作 $("form").live('keydown',function ...
- form表单中的input有哪些类型
form表单中的input有哪些类型 1.button <input type="button"/> 2.checkbox <input type="c ...
- form表单中经常用到的禁用获取值问题
<input name="country" id="country" size=12 value="disabled提交时得不到该值 " ...
随机推荐
- Mysql时间存储类型优缺点?DATETIME?TIMESTAMP?INT?
TIMESTAMP 4个字节储存;值以UTC格式保存;.时区转化 ,存储时对当前的时区进行转换,检索时再转换回当前的时区. DATETIME 8个字节储存;实际格式储存;与时区无关;datetime ...
- Atitit.编程语言的主要的种类and趋势 逻辑式语言..函数式语言...命令式语言
Atitit.编程语言的主要的种类and趋势 逻辑式语言..函数式语言...命令式语言 1. 编程语言的主要的种类 逻辑式语言..函数式语言...命令式语言 1 2. 逻辑式语言,,不必考虑实现过程而 ...
- XCode5中新建工程后强制使用了ARC,如何去掉?
打开你的工程,点击目录的工程文件,最顶端蓝色的,然后选择project下你的工程,还是蓝色那项,然后build Settings,然后往下拉,在Apple LLVM 5.0 - Language - ...
- VS2015配置Linux开发远程调试
# VS2015配置Linux开发远程调试 ### 简介-----------------------------vs2015支持跨平台开发 ### 软件环境--------------------- ...
- openvpn 移植之buildroot添加相关选项
openvpn 移植第一步,在buildroot 内添加 openssl ,openvpn , 另外还有一个 RSA 的支持,我不确定这个需要程度如何,但是也添加进去了. buildroot 添加相关 ...
- linux 短信收发
#include <termios.h>#include <stdio.h>#include <stdlib.h>#include <unistd.h> ...
- 回车替换Tab 并不会 提交表单 IE Chrome 通过
网上一堆可以回车替换tab的代码,可是基本都忽略谷歌浏览器的兼容性,找了3个小时 试了无数遍,终于总结出这一段代码,希望能帮到需要的同学,也给自己留个备忘 document.onkeyd ...
- mysql 分区 限制
MySQL分区的限制 • 只能对数据表的整型列进行分区源码天空,或者数据列可以通过分区函数转化成整型列 • 最大分区数目不能超过1024 • 如果含有唯一索引或者主键,则分区列必须包含在所 ...
- Android 性能测试之TraceView的使用
Traceview是android平台配备一个很好的性能分析的工具.它可以通过图形化的方式让我们了解我们要跟踪的程序的性能,并且能具体到method. 在SDK路径\tools目录下. 1.在开始使用 ...
- Exception in thread "main" java.lang.NoClassDefFoundError: com/google/common/base/Function问题解决
selenium 目录下的lib文件夹下的所有包都加到类库里