javascript - 内容可编辑指令无法正常工作

我是 angularjs 的新手。在这里，我有一张表，我正在使用 contenteditable 的 HTML5 属性。现在，我有以下代码 -

<td class="td-report-field" contenteditable="disabledoneButton"
    contextmenu-item="report" context-menu="menuOptions">
  {{ report.attributes.field }}
</td>

在这里，我试图在 disabledoneButton 的基础上使用它。现在 displayDoneButton 的值是 true 然后它也不会将该行作为可编辑。现在，我通过使用 contenteditable = 'true' 尝试了它，然后它开始工作，但不是 disabledoneButton 的值。

我也有一个指令——

 var contentEditable = [function () {
        return {
            restrict: 'A',
            require: '?ngModel',
            link: function(scope, element, attrs, ngModel) {
                if (!ngModel) {
                     return;
                }
                ngModel.$render = function() {
                    element.html(ngModel.$viewValue || '');
                };

            ngModel.$render();

            // Listen for change events to enable binding
            element.bind('blur keypress keyup change', function() {
                scope.$apply(read);
            });
            // Write data to the model
            function read() {
                ngModel.$setViewValue(element.html());
            }
        }
    };
    }];

任何人都可以帮我解决这个问题吗？提前致谢。

最佳答案

要为属性值提供数据绑定(bind)，请使用 interpolation markup 作为:

contenteditable="{{disabledoneButton}}"

来自 the docs :

关于javascript - 内容可编辑指令无法正常工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45796752/