0

我的代码如下:

<!doctype html>
<html ng-app="flyerGen">
<head>
<script src="http://code.angularjs.org/1.0.5/angular.min.js"></script>
<script>
angular.module('flyerGen', []).directive('contenteditable', function() {
    return {
        require: 'ngModel',
        link: function(scope, elm, attrs, ctrl) {
            // view -> model
            elm.bind('keyup', function() {
                scope.$apply(function() {
                    ctrl.$setViewValue(elm.html());
                });
            });

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

            // load init value from DOM
            ctrl.$setViewValue(elm.html());
        }
    };
});
function FlyerCtrl($scope) {
    $scope.Flyer = { bgColor : '231,233,230', title : 'WIE WAREN WIR HEUTE?', description: 'Bitte scannen Sie den QR-Code und geben Sie uns Feedback' }
}

</script>
</head>
<Body>
<div contentEditable ng-model="Flyer.title">{{ Flyer.title }}</div>
Test: {{ Flyer.title }}
</div>
</Body>
</html>

加载页面时,我在控制台中看到以下错误:错误:无控制器:ngModel。我还尝试设置“FlyerCtrl”,也设置“Flyer”而不是“ngModel”,但没有任何效果。

错误在哪里?

4

1 回答 1

3

几个项目:

  • HTML应该contenteditable没有contentEditable
  • 不要从 DOM 加载初始值——你的模型中已经有了它,所以从你的 HTML 中删除它: <div...> {{ Flyer.title }} </div> 并且不要调用 $setViewValue最初。

笨蛋

于 2013-03-15T20:35:35.620 回答