Как использовать ng-repeat с редактором quill

Привет, я пытаюсь использовать редактор Quill js и использовать его с повторением ng. (У меня есть перо) Мне нужно использовать повторение.

Этот код возвращает мне ошибку, например:

quill Недопустимый контейнер Quill #content245

quill Недопустимый контейнер Quill #content244

quill Недопустимый контейнер Quill #content243 ....

Мне нужна ваша помощь !

        $http.post("/getwallpost", reqGetPost).then(function(response) {
            var accounts = [];
            $scope.postsProfile = response.data
            
            for (var i = 0; i < response.data.length; ++i) {
                if(response.data[i].type_id == 1) {
                     accounts[i] = new Quill("#content" + response.data[i].id + "", optionwall);
                     accounts[i].setContents(JSON.parse(response.data[i].content))
                     
                }
            }
        });
<div ng-repeat="post in postsProfile" >
  <div class='postcontent' id='content{{post.id}}'></div>
</div>


person Ke Vin    schedule 22.05.2018    source источник


Ответы (2)


Я бы попробовал добавить ng-if на повтор

 $http.post("/getwallpost", reqGetPost).then(function(response) {
            var accounts = [];
            $scope.postsProfile = response.data

            for (var i = 0; i < response.data.length; ++i) {
                if(response.data[i].type_id == 1) {
                     accounts[i] = new Quill("#content" + response.data[i].id + "", optionwall);
                     accounts[i].setContents(JSON.parse(response.data[i].content))

                }
            }
            $scope.showRepeat = true;
    });



<div ng-repeat="post in postsProfile" ng-if="showRepeat">
  <div class='postcontent' id='content{{post.id}}'></div>
</div>

ИЗМЕНИТЬ

может быть и обратная проблема.

Вы также должны попытаться вызвать новый Quill при печати последнего повтора...

app.directive("lastRepeat", function(){
    return {
        restrict: "A",
        link: function(scope, el, attrs){
            if(scope.$last){
                var eventId = "LR_";
                eventId += !!attrs.lastRepeat ? attrs.lastRepeat : "last";
                scope.$root.$broadcast(eventId);
            }
        }
    };
}); 

HTML

<div ng-repeat="post in postsProfile" ng-if="showRepeat" last-repeat="foo">
  <div class='postcontent' id='content{{post.id}}'></div>
</div>

и в вашем js...

 $scope.$root.on("LR_foo", function(){
          var data = angular.copy($scope.postsProfile);
          for (var i = 0; i < data.length; ++i) {
                if(data[i].type_id == 1) {
                     accounts[i] = new Quill("#content" + data[i].id + "", optionwall);
                     accounts[i].setContents(JSON.parse(data[i].content))

                }
            }

 });

 $http.post("/getwallpost", reqGetPost).then(function(response) {
            var accounts = [];
            $scope.postsProfile = response.data


            $scope.showRepeat = true;
    });
person Sampgun    schedule 22.05.2018
comment
не работает в обоих направлениях, мне говорит: $scope.$root не является функцией - person Ke Vin; 22.05.2018

Я нашел другой способ сделать это, потому что кажется невозможным использовать ng-repeat с quill (или я не знаю ответа). Я использовал функцию добавления Jquery. Но вы должны использовать компилятор angularJS ($compile) для компиляции html

Вы можете узнать больше об этом: добавить html, включая ng-click в angularjs

это просто и работает отлично

person Ke Vin    schedule 23.05.2018