Angularjs - 在没有ng-model的元素上使用$ watch

Question

我正在尝试使用AngularJS进行recaptcha（cleany）。

我的指令正在创建recaptcha。使用回调函数，我试图监视输入中的任何更改（recaptcha_challenge_field，recaptcha_response_field）

我可以将值传递给范围：

scope.recaptcha_challenge_field = "value_taken_from_input_after_creation"

我的问题是重新创建代码是在没有我的情况下创建的，因此我无法在这些输入中添加ng-model。所以，当我做一个

scope.$watch('recaptcha_response_field', function(newValue, oldValue) { 
console.log('recaptcha_response_field ' + newValue); 
});

没有任何事情发生，因为很明显scope.recaptcha_challenge_field没有链接到

<input name="recaptcha_response_field" id="recaptcha_response_field" type="text">

我的想法：

1. 动态地将ng-model添加到我的输入中，但我无法想出那个
2. 将我的值绑定到input元素并观察它们

对任何建议持开放态度。

由于

Answer 1

在不知道你正在使用哪个recapthca库的情况下，我只能在黑暗中拍摄。但我会做的是

1. 获取var recaptchaElement = angular.element(...)对recaptcha
的引用
2. 使用.attr('ng-model', 'myProp')
将ng-model添加到文本输入中
3. 在元素上调用$ compile，以便有角度知道它：$compile(recaptchaElement)(scope)

理想情况下，这一切都应该在指令中。如果你制作http://plnkr.co/我可以提供更多帮助。