用ng-model动态禁用一个span

我正在使用ngModelController制作自定义可编辑的<span>的示例:https://docs.angularjs.org/api/ng/type/ngModel.NgModelController示例

我现在想做的是能够通过指令本身内的逻辑动态禁用此字段的编辑。通过禁用它，我的意思是用户将无法编辑文本，它只是显示为普通文本。

这是一个样品:

代码来自plunkr:

angular.module('app', [])

.controller('Ctrl', function ($scope) {
    $scope.stuff = "test";
  })
  .directive('contenteditable',
    function ($log) {
        'use strict';
        return {
            restrict: 'A',
            require: 'ngModel',
            scope: {
            },
            link: function ($scope, $element, $attributes, ngModel) {
                if (angular.isUndefined(ngModel)) {
                    $log.warn('ngModel is not defined');
                    return;
                }
                function read() {
                    ngModel.$setViewValue($element.text());
                }
                ngModel.$render = function () {
                    $element.html(ngModel.$viewValue || '');
                };
            }
        };
    }
);