angularjs - 进行ajax调用以在angular js中填充范围数据

Question

你好，我有一个像这样的 angular js Controller

function InstantSearchController($scope){

$scope.items = [
    {
        url: 'http://tutorialzine.com/2013/04/services-chooser-backbone-js/',
        title: 'Your First Backbone.js App – Service Chooser',
        image: 'http://cdn.tutorialzine.com/wp-content/uploads/2013/04/service_chooser_form-100x100.jpg'
    }
];

我有一个ajax调用

function getListOfJsonObjects(){
$.ajax({
    url:"http://"+window.location.host+"/getListOfJsonObjects",
    type: "GET",
    beforeSend: function (request)
    {
        request.setRequestHeader("JSESSIONID",  $.cookie("JSESSIONID"));
    },
    dataType: 'jsonp',
    data: {
        foreignKeyType:"OrgChartJSon",
    },
    success:
        function(dataFromServer){
        var parsedJSON = jQuery.parseJSON(JSON.stringify(dataFromServer));                  

    },
    error:
        function(xhr, status, error){

        alert("Failed");
    }
});

我如何进行 $http.jsonp 调用以便将响应数据放入范围项中。请帮助我尝试调用 var responsePromise = $http.jsonp(url, {params : {foreignKeyType:"DecisionTreeJSon"} } );即使认为响应状态是 200，它也总是进入失败方法。

Angular 代码:

<div ng-app="instantSearch" ng-controller="InstantSearchController">

<div class="bar">
    <!-- Create a binding between the searchString model and the text field -->
    <input type="text" ng-model="searchString" placeholder="Enter your search terms" />
</div>

<ul>
    <!-- Render a li element for every entry in the items array. Notice
         the custom search filter "searchFor". It takes the value of the
         searchString model as an argument.
     -->
    <li ng-repeat="i in items | searchFor:searchString">
        <a href="{{i.url}}"><img ng-src="{{i.image}}" /></a>
        <p>{{i.title}}</p>
    </li>
</ul>

Answer 1

不要在 AngularJS 项目中使用 jQuery。

您必须使用 $http $resource 服务来查询网络服务。

Here is a plunker为了展示如何使用 $http 来填充范围，它不是 jsonp，但你应该很容易地扩展这个例子。