javascript - model.$modelValue 指令中为 NaN

Question

查看这个jsfiddle:http://jsfiddle.net/8bENp/66/

如果您查看 JavaScript 控制台，您会看到如下内容:

TypeError: Object NaN has no method 'replace'
    at makeHtml (https://raw.github.com/coreyti/showdown/master/compressed/showdown.js:62:705)
    at render (http://fiddle.jshell.net/_display/:50:42)
    at link (http://fiddle.jshell.net/_display/:54:13)
    at k (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:42:321)
    at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:38:198)
    at k (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:42:261)
    at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:38:198)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:37:332
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:15:440
    at Object.e.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js:85:416) <markdown ng-model="someCode" class="ng-pristine ng-valid"> angular.min.js:60

问题是 model.$modelValue 是 NaN，而其类型甚至不应该是数字。尽管如此， Markdown 还是呈现了。我可以添加一个 typeof model.$modelValue == 'string' 检查，但我宁愿处理根本原因。有什么想法吗？

Answer 1

我不知道 $modelValue 被初始化为 NaN 并遇到了类似的问题。如果初始化时确实需要 $modelValue，解决方案可能是观察它，直到为它分配新值:

.directive('contentEditor', function(){
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function($scope, $element, $attrs, ngModel){

            var unregister = $scope.$watch(function(){
                return ngModel.$modelValue;
            }, initialize);

            function initialize(value){
                ngModel.$setViewValue(value);
                unregister();
            }

            //...
        }
    };
});

$watch 返回一个注销函数，因此一旦为 $modelValue 分配了新值，就可以注销它。