uploadcare.com的angularjs数据绑定不起作用

时间:2015-03-13 11:45:08

标签: angularjs data-binding 2-way-object-databinding

我试图将上传脚本集成到我的页面中。我正在使用uploadcare.com。他们提供了一个简单的指令,但我无法让它起作用:

https://github.com/uploadcare/angular-uploadcare/blob/master/angular-uploadcare.js

我设置了ng-model =" test"在我的控制器中,我有以下内容:

angular.module('testApp')
  .controller('MyCtrl', function ($scope) {
    $scope.test = "test";
  });

html代码如下:

<uploadcare-widget ng-model="test" data-public-key="xyz" />

当我查看Firebug时,我可以看到小部件有效:

<input type="hidden" role="uploadcare-uploader" ng-model="test" data-public-key="6e0958899488d61fd5d0" data-crop="1200:630" value="http://www.ucarecdn.com/ca5513da-90f1-40d1-89e7-648237xxxxxx/-/crop/2560x1344/0,128/-/preview/" class="ng-isolate-scope ng-valid">

但是这个输入值永远不会填充到我的&#34; $ scope.test&#34;中。这是为什么? 当我输出$ scope.test时,它仍然说&#34; test&#34;而不是我的图像路径值。

2 个答案:

答案 0 :(得分:2)

您可以在角度

中使用$ watch
$scope.$watch('test', function(newValue, oldValue) {
    console.log($scope.test);
});

或者uploadcare提供的功能

$scope.onUCUploadComplete = function(info){
  console.log(info);
}; 

图像上传后的回调函数

答案 1 :(得分:1)

请检查测试模型的范围。 您还可以在指令中更新范围变量,如

scope.test = $element.value()