Javascript 角度http jsonp配置中的变量

我正在使用http.jsonp进行跨域调用，一切正常，我的配置对象如下：

 var config = {
            params: {
                action: "query",
                prop: "revisions",
                format: "json",
                rvlimit: 50,
                titles: 'obama',//works
               // titles: val, //doesn't works
                callback: "JSON_CALLBACK"    
            }           
        };

        var url = "http://en.wikipedia.org/w/api.php?";

        $http.jsonp(url, config).success(function(data) {
            var pages = data.query.pages;

            for (var pageid in pages)
            {        
                $scope.revisions = pages[pageid].revisions;
                break; // expect only one page
            }

            $scope.loaded = true;
        });

当标题具有静态值obama时，它可以正常工作，但是我添加了一个输入框，从中获取值，并且我尝试将输入框的值设置为标题并加载特定提要，但是它不起作用。我在JSFIDLE上转载了这个问题

有没有办法解决这个问题/

---

我假设您需要在用户点击“Go”按钮后获取内容

代码的问题在于，您正在使用

val

来设置标题，而不是

$scope.val

如果在用户单击按钮时更新该按钮，然后更正代码以发出HTTP请求，则会按预期获取数据

这说明了解决方案

---

只需在输入中键入“obama”并单击按钮即可获取数据。

由于您没有使用$scope获取

ng模型的值，请使用
$scope.val
而不是
val

试试这个

var config = {
    params: {
        action: "query",
        prop: "revisions",
        format: "json",
        rvlimit: 50,
        titles: $scope.val,
        callback: "JSON_CALLBACK"    
    }           
};

最好稍微重新组织一下代码。将数据加载功能移动到如下服务中：

app.factory('Wiki', function ($q, $http) {
    return {
        loadData: function (title) {

            var deferred = $q.defer(),
            config = {
                params: {
                    action: "query",
                    prop: "revisions",
                    format: "json",
                    rvlimit: 50,
                    titles: title,
                    callback: "JSON_CALLBACK"
                }
            },
            url = "http://en.wikipedia.org/w/api.php?";

            $http.jsonp(url, config).success(function(data) {
                var pages = data.query.pages;
                for (var pageid in pages) {
                    deferred.resolve(pages[pageid].revisions);
                    break;
                }
            });

            return deferred.promise;
        }
    };
});

然后您可以在控制器中这样使用它：

app.controller('HistoryController', function($scope, Wiki) {
    $scope.loaded = false;
    $scope.getData = function(val) {
        Wiki.loadData(val).then(function(data) {
            $scope.loaded = true;
            $scope.revisions = data;
        });
    }
    $scope.getData('obama');
});

在处理数据时，使用服务使一切变得更加灵活

演示：这将不起作用，因为一旦控制器加载，就会发出
HTTP
请求。此时，
$scope.val
将为空，因此不会获取任何结果。请看我的提琴，了解正确的方法。我正是这样做的，我只是创建了一个提琴来说明问题，但问题是，不使用callmekatootie所做的承诺就可以解决这个问题。如果callmekatootie做了你想做的事，那么问题是什么？他将其说明为控制器中的数据，我的代码就像你们组织成一个服务，然后在控制器中调用服务一样。所以我的问题是，使用你的方法，我如何在不使用承诺的情况下解决这个问题。希望我清楚。