jquery方法不是從角回調調用？

Question

我有以下代碼：

$http({method: 'GET', url: 'api/participants/areyouhuman'}) 
      .success(function(data, status, headers, config) { 
       console.log(data); 
       $('.result').html(data); 
       //$('.result').append('<p>Test</p>'); 

     }) 
     .error(function(data, status, headers, config) { 
      console.log('error'); 
     }); 

data有這樣的：

'<div id="AYAH">mk</div><script src="https://ws.areyouahuman.com/ws/script/8e53b417da61504de194550d3a6bf05c65d2a2b1" type="text/javascript" language="JavaScript"></script>' 

當成功回調執行看法不符合新的HTML反映。

我有以下HTML代碼：

 <div class="form-group"> 
      <div class='result'></div> 
    </div> 

你GUS可以建議我在哪裏，我做錯了。或者如果你有其他方法？

Answer 1

1. 爲什麼要在使用AngularJS時使用jQuery？
2. 是jQuery加載？
3. 此代碼適用於我：http://jsfiddle.net/Schniz/j7p2zxrs/
4. 我建議您更改$scope而不是自己控制DOM。這是角的工作..

Answer 2

更新下面的代碼片段：

$http({method: 'GET', url: 'api/participants/areyouhuman'}) 
     .success(function(data, status, headers, config) { 
      console.log(data); 
      $scope.content = data; 
      //$('.result').html(data); 
      //$('.result').append('<p>Test</p>'); 

    }) 
    .error(function(data, status, headers, config) { 
     console.log('error'); 
    }); 

HTML：

<div class="form-group"> 
     <div class='result'>{{content}}</div> 
</div> 

Answer 3

那麼這裏的第一件事就是，你不應該做的DOM操作一樣，在Angularjs。由於角有一個強大的2路綁定，以便您的代碼會是這樣

// I assume you're calling an ajax request in a controller 
$http({method: 'GET', url: 'api/participants/areyouhuman'}) 
     .success(function(data, status, headers, config) { 
      // Have a scope variable within the same scope will help you 
      $scope.dataAjax = data; 
    }) 
    .error(function(data, status, headers, config) { 
     console.log('error'); 
    }); 

然後在你的HTML，你可能會如果你的回報HTML數據有事情做與需要這個

<div class="form-group"> 
    <div class='result'>{{dataAjax}}</div> 
</div> 

應用程序，也許你會考慮使用$ scope。$ apply（）來更新DOM。

Answer 4

你需要改變2件事情。

1. 不要操縱控制器內部的DOM元素（這是一個不好的做法），而不是用一般的角度數據綁定：

   $http({method: 'GET', url: 'api/participants/areyouhuman'}) 
       .success(function(data, status, headers, config) { 
       console.log(data); 
       $scope.htmlData = data; 
   }) 
   .error(function(data, status, headers, config) { 
       console.log('error'); 
   }); 
   

2. 爲了使外部HTML內容，您需要使用ng-bind-html指令：

   <div class="form-group"> 
       <div class='result' ng-bind-html="htmlData"></div> 
   </div> 
   

如果你得到一個$sce:unsafe錯誤，你將不得不使用$sce服務，這樣告訴角度，以「信任」是HTML：

$http({method: 'GET', url: 'api/participants/areyouhuman'}) 
    .success(function(data, status, headers, config) { 
     console.log(data); 
     $scope.htmlData = $sce.trustAsHtml(data); 
     ... 

（不要忘記將$sce作爲依賴添加到控制器）