Question

我按照此示例使用<span>制作自定义可编辑ngModelController： https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#example

我现在要做的是能够通过指令内部的逻辑动态禁用对该字段的编辑。通过禁用它我的意思是用户根本无法编辑文本，它只会显示为常规文本。

以下是plunkr示例：

来自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 || '');
                };
            }
        };
    }
);

任何帮助都将不胜感激。

Answer 1

感谢AngularJS的gitter.im房间里非常有帮助的人，我意识到contentEditable是一个真正的html5 api，这就是使span元素可编辑的原因，而不是AngularJS。

我所要做的就是更改指令的名称并动态删除contentEditable。

使用ng-model动态禁用跨度

1 个答案: