将一些代码从jQuery重写为Angular

Question

我只是在学习，现在将我的代码从jQuery重写为Angular，有一些问题，希望您可以帮助我解散它们。

当前HTML：

<div class='image_hold'>
  <img class='image'>
  <input type='hidden' name='image_answer' class='image_input'>
</div>

JS：

function loadGraphic() {
  $.post('generate.php', { keyword: 'image' })
    .done(function(data) {
      $('.image_input').val(data);
      $('.image').attr('src', data);
    })
    .fail(function(data) {
      alert('error');
    })
};

那么，到底要在Angular中看一下代码？我目前的尝试：

$scope.loadGraphic = function() {
  $http({
      method:  'POST',
      url:     'generate.php',
      data:    image,
  })
  .success(function(data) {
    if (data.errors) {
      $window.alert(error);
    } else {
      //
    }
  });
};

我想我必须添加html之类的东西，例如ng-src ...任何帮助都将不胜感激。

Answer 1

您将需要添加返回的映像SRC作为$scope上的属性，以在模板中参考，然后如您说的那样使用ng-src。希望这将成为起点;

$scope.imageSrc = null;
$scope.loadGraphic = function() {
    $http({
        method:  'POST',
        url:     'generate.php',
        data:    image,
    })
    .then(function(data) {
        $scope.imageSrc = data;
    })
    .catch(function(errorResponse) {
        // Handle errors in here
    });
};
// Template
<!-- ... -->
<img ng-if="imageSrc" ng-src="imageSrc" class="image">