javascript - 使用 Angular 动态添加 HTML 属性

Question

我正在尝试将 HTML 属性添加到表单字段以在 JSON 文件中的属性为真时禁用它。

在我的表单字段中，我添加了 data-is-disabled={{field.rules.disabled}}，它是从以下 JSON 中读取的

"rules" : {
    "disabled": "true"
}

然后我的模块中有一个指令，我想删除该属性并将其替换为 disabled 属性以禁用该字段。

app.directive ('isDisabled', function($compile) {
    return {
        restrict: 'A',
        compile: function (element) {
            element.removeAttr("data-is-disabled");
            element.attr("disabled");
            var fn = $compile(element);
            return function(scope){
                fn(scope);
            };
        }
    }
});

这看起来过于复杂，但是对于多个不同字段类型的情况是必要的，在这种情况下需要禁用该字段。

我已经尝试了一些来自 SO 的不同解决方案，但我还没有得到它的工作。该属性保持为 data-is-disabled="true"。

非常感谢。

Answer 1

让它更简单并使用它。

https://docs.angularjs.org/api/ng/directive/ngDisabled

ng-disabled={{field.rules.disabled}}

请小心并检查您的数据，因为 true 是一个字符串，而不是...

ng-disabled={{JSON.parse(field.rules.disabled)}}