angulaire.js - Solution : angulaire ngModel.$render n'est pas automatiquement appelé lorsque la valeur change

Question

Récemment, j'utilise angulaire pour créer un éditeur WYSIWYG. Lorsque je personnalise la méthode $render de ngModel, un problème survient. Le code est le suivant :

partie html :

<p ng-controller="EditController">
        <p contenteditable="true" edit-box ng-model="vm.content" style="width: 300px; height: 100px;border: 1px solid dodgerblue;"></p>
        <p ng-bind-html="vm.content|trustAsHtml"></p>
    </p>

partie angulaire :

angular.module('myApp',[])
            .controller('EditController',function($scope){
                $scope.vm={
                    content:''
                };
            })
            .filter('trustAsHtml',function($sce){
                return function(content){
                    return $sce.trustAsHtml(content);
                }
            })
            .directive('editBox',function(){
                return {
                    restrict:'EA',
                    require:'ngModel',
                    link:function(scope,element,attr,ngModelCtrl){
                        if(!ngModelCtrl)return;

                        //覆盖默认的$render方法
                        ngModelCtrl.$render=function(){
                            element.html(ngModelCtrl.$viewValue);
                        };

                        //向formatters流水线增加一个格式化方法
                        ngModelCtrl.$formatters.unshift(function(value){
                            console.log(value);
                           return value;
                        });
                        //绑定输入事件监听，当输入时，改变ngModel的值
                        element.bind('input',function(){
                           scope.$apply(function(){
                              ngModelCtrl.$setViewValue(element.html());
                           });
                        });
                    }
                }
            });

Selon le didacticiel, lorsque la valeur de viewValue change, ngModelCtrl.$render sera appelé, y compris une série de pipelines tels que des formateurs et des analyseurs. Je l'ai également écrit selon le tutoriel, mais le rendu et les formateurs ne sont appelés qu'une seule fois lors de l'initialisation de la commande, puis ils ne sont pas appelés lors de la saisie. Dois-je appeler le rendu manuellement ?

Answer 1

Êtes-vous sûr qu'il y a un événement appelé javascript dans input ? D'après votre commentaire, vous devez surveiller des événements tels que keyup, keydown et change