【问题标题】:angular formly read-only mode for radio , multiCheckbox and checkboxradio , multiCheckbox 和 checkbox 的角度形式只读模式
【发布时间】:2015-09-21 11:16:07
【问题描述】:

我需要以只读模式显示表单,我正在使用 angular-formly 创建基于 Json 的表单。检查了链接http://angular-formly.com/#/example/other/read-only-form,它适用于文本输入,请建议如何将radio、multicheckbox和checkbox设置为只读

【问题讨论】:

  • 将 ng-readonly 属性设置为 true docs.angularjs.org/api/ng/directive/ngReadonly
  • 我正在使用 angular-formly 创建表单,无法为 angular-formly 设置 ng-readonly
  • 你能不能给它做一个plunker,我可以帮你修好它

标签: angularjs angular-formly


【解决方案1】:

我们通过 jQuery 来实现:

   $(document).ready(function () {
            $('input').click(function (e) {
                e.preventDefault();
            });
        });

或者如果你想“假装”你正在使用“angular”来做到这一点,即使你实际上正在使用 jQuery,并且想要输入更多的代码来编写完全相同的东西(从字面上看,它会只需在 jQuery 中运行上面的代码,因为 angular.element 是 jQuery 的“别名”——直接来自 angular 文档:https://docs.angularjs.org/api/ng/function/angular.element),你可以这样做:

   angular.element(function() {
        angular.element('input').trigger('click')(function(e) {
            e.preventDefault();
        };
   });

通过这种方式,您可以看起来很酷,并且会吐出诸如“同时运行 Angular 和 jQuery 是不好的做法”之类的废话,因为您不知道自己在说什么,只是在某个地方阅读。

这适用于所有输入字段。如果您有按钮或带有按钮的日期选择器等,最简单的方法是在表单中的模型上设置一个只读属性,然后在您希望它只读的页面上将其设置为 true,然后设置 ng-show在按钮上:ng-show="!model.readOnly"

【讨论】:

  • 在 Angular 中使用 jQuery 是一种不好的做法。尽可能避免它
  • 为什么? Angular固有地使用jquery......哦对不起,你希望我通过调用angular.element来“假装”使用angular,即使angular.element是angular对jquery的实现(如果你没有安装它,要么是jquery Lite,要么直接映射到 jQuery(如果已安装)。这只是“不好的做法”,因为有人说它甚至不了解引擎盖下发生的事情。直接从角度文档:“angular.element 是 jquery 的别名。” docs.angularjs.org/api/ng/function/angular.element。任何说不要混合 angular 和 jquery 的人都是无能的
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-03-03
  • 2017-06-17
  • 1970-01-01
  • 2016-03-15
  • 2021-11-25
相关资源
最近更新 更多