Question

我有一个指令，我在div上添加，以便能够编辑它的内容并对范围进行双向绑定。当我按下返回按钮时，我希望模糊，我已经尝试了element[0].blur();，如下所示。但是这不起作用。我该怎么办？

.directive("contenteditable", function() {
    return {
        restrict: "A",
        require: "ngModel",
        link: function(scope, element, attrs, ngModel) {

            function read() {
                ngModel.$setViewValue(element.html());
            }
            ngModel.$render = function() {
                element.html(ngModel.$viewValue || "");
            };
            element.bind("blur keyup change", function() {
                scope.$apply(read);
            });


            element.css('outline','none');
            element.bind("keydown keypress", function (event) {
                if(event.which === 13) {
                    element[0].blur();
                    event.preventDefault();
                }
            });

        }
    };
});

Answer 1

我猜你在HTML内部正在使用ng-model：

<input type="text" contenteditable ng-model="myModel"/> //add ng-model.

因为你的指令需要ng-model。

请看这里，效果很好：http://plnkr.co/edit/g0qtbFJb1V4OxcXNRTVf?p=preview

编辑（使用div而不是输入标记）

请参阅演示：http://plnkr.co/edit/UiosU1WvyUvhgLBlzX6r?p=preview

Answer 2

我找到了解决方案，诀窍是在致电$window.getSelection().removeAllRanges();

之前致电element[0].blur();

Enter上的AngularJS可疑模糊

2 个答案: