Wordpress 从 Angular JS 函数（ng-click）打开媒体库

Question

我正在编写一个插件，我需要 select 图片。我已经完成了调用媒体库 window 的正确代码。但是，当我单击按钮并 select 来自媒体库的图像时，没有任何反应。如果我再次单击，第一个图像 url selected 会出现在文本框中。

这是我的 HTML 代码：

<div class="uploader">
    <input id="library_image" name="settings[library_image]" ng-model="imagenAd" disabled type="text" />
    <button id="open_library" ng-click="open_media_library()" class="button" name="open_library">Seleccionar</button>
</div>

还有控制器代码：

$scope.imagenAd = '';
var selURL = '';
var window = wp.media({
    title: 'Seleccione una imagen para el anuncio',
    library: {type: 'image'},
    multiple: false,
    button: {text: 'Insert'}
});

// Function used for the image selection and media manager closing
var gk_media_set_image = function() {
  var selection = window.state().get('selection');

  // no selection
  if (!selection) {
      return;
  }

  // iterate through selected elements
  selection.each(function(attachment) {
      var url = attachment.attributes.url;
      //alert(url);
      selURL = url;
  });
};

// closing event for media manger
window.on('close', gk_media_set_image);
// image selection event
window.on('select', gk_media_set_image);

$scope.open_media_library = function(obj, $event){
    window.open();
    $scope.imagenAd = selURL;
  }

我做错了什么？谢谢

Answer 1

我从未使用过 Angular JS，但我可以使用 jquery.

轻松给你答案

但前提是您不必使用 Angular。

Answer 2

尝试改变

window.on

和

angular.element(window)

喜欢这里：http://jsfiddle.net/U3pVM/19323/

Answer 3

已解决： 因为 selURL 变量在 angular 世界之外被修改，Angular 只能在每个摘要循环中应用他的值。因此，在 window 的每次调用中，我们都需要强制摘要： $angular.$digest();

Answer 4

我已经替换了你的 open_media_library 函数，然后它对我有用。

$scope.open_media_library = function(obj, $event){
  window.open();
   setTimeout(function() {
    $scope.imagenAd = selURL;
    $scope.$apply(); //this triggers a $digest
  }, 2000);

}

Wordpress 从 Angular JS 函数（ng-click）打开媒体库

Wordpress opening media library from Angular JS function (ng-click)

javascript

jquery

angularjs

wordpress

angularjs-ng-click