当第三方组件修改文本框值时，如何更新范围/ ng-model？

Question

我想使用颜色选择器制作编辑器。

这是一个简化的示例。 http://jsfiddle.net/xcUev/8/

我将颜色视为角度范围对象的属性。 我通过使用颜色选择器

选择它

 http://www.html5.jp/library/cpick.html 

但在选择颜色后，它不会影响范围。

您是否有任何想法使其有意义地影响范围此输入状态的范围。

请帮帮我......

Answer 1

我尝试了bind（）一个change事件，但它从未被触发（可能是因为颜色选择器停止了事件的传播）。所以我接下来尝试了bind（）一个focus事件，这似乎有用（我注意到文本框失去了焦点，然后在画布隐藏时再次将它取回）。

HTML：

<input type="text" ng-model="data.color" class="html5jp-cpick" cpick>

指令：

app.directive('cpick', function() {
    return {
        require: 'ngModel',
        link: function(scope, element, attrs, ngModelCtrl) {
            element.bind('focus', function() {
                ngModelCtrl.$setViewValue(element.val());
                scope.$apply();
            });
        }
    }
})

Fiddle