angular js two way binding contenteditable via scope attribute

孤街醉人 提交于 2019-12-06 14:42:33

问题


Is it not possible to set value from parent scope to contentEditable directive via isolated scope using two-way binding?

Code here: http://jsfiddle.net/bharatwaj/3wTd3/5

HTML:

    <input ng-model="foo" />
    <div contentEditable="true" binding-foo="foo" ng-model="input.name" title="Click to     edit"></div> 
    <pre>model = {{input.name}}</pre>

JS:

    angular.module('form-example2', []).directive('contenteditable', function () {
        return {
        scope: {
            isolatedBindingFoo: '=bindingFoo'
        },
        require: 'ngModel',
        link: function (scope, elm, attrs, ctrl) {
            console.log('isolatedBindingFoo value is ' + scope.isolatedBindingFoo);
            // view -> model
            elm.bind('blur', function () {
            scope.$apply(function () {
                ctrl.$setViewValue(scope.isolatedBindingfoo);
            });
            });

            // model -> view
            ctrl.$render = function () {
            elm.html(ctrl.$viewValue);
            };

            // load init value from DOM
            // Why is content editable value displayed as Hello!
            // after setting view value below?
            ctrl.$setViewValue(scope.isolatedBindingFoo);
        }
        };
    });

    function ItemCtl($scope) {
         $scope.foo = 'Hello!';
    }

I have a ng-model which is set to 'Hello!' in controller and is two-binding to content editable div

shouldn't contentEditable div display Hello!?

Note: It is possible to set by interpolate like below but i would like to know if it not possible to set via two-binding in scope.

{{foo}}

来源:https://stackoverflow.com/questions/17803171/angular-js-two-way-binding-contenteditable-via-scope-attribute

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!