小编MyB*_*oon的帖子

在AngularJs指令中集成Redactor WYSIWYG

我尝试将Beautifull WYSIWYG Redactor(http://imperavi.com/redactor/)集成到自定义的AngularJS指令中.

Visualy它可以工作,但我的自定义指令与ng-model不兼容(我不明白为什么)

这是你如何使用我的指令:

<wysiwyg ng-model="edited.comment" id="contactEditCom" content="{{content}}" required></wysiwyg>
Run Code Online (Sandbox Code Playgroud)

这是指令代码:

var myApp = angular.module('myApp', []);
myApp.directive("wysiwyg", function(){

var linkFn = function(scope, el, attr, ngModel) {

    scope.redactor = null;

    scope.$watch('content', function(val) {
        if (val !== "")
        {
            scope.redactor = $("#" + attr.id).redactor({
                focus : false,
                callback: function(o) {
                    o.setCode(val);
                    $("#" + attr.id).keydown(function(){
                        scope.$apply(read);
                    });
                }
            });
        }
    });

    function read() {
        var content = scope.redactor.getCode();
        console.log(content);
        if (ngModel.viewValue != content)
        {
            ngModel.$setViewValue(content);
            console.log(ngModel);
        }
    }

};

 return { …
Run Code Online (Sandbox Code Playgroud)

wysiwyg directive angularjs redactor

10
推荐指数
1
解决办法
9496
查看次数

标签 统计

angularjs ×1

directive ×1

redactor ×1

wysiwyg ×1