Javascript 使用angularJS$get获取数据

我正在尝试使用angular js$get获取数据。我可以用如下简单的函数来实现：

 <script>
    $(document).ready(function() {
        $.getJSON('{% url 'ajax-view' %}', function(data) {
            alert(data['revenue']);
        })
    })


</script>


but trying this way in angular. since im new to this. cant get it work.



      <script>

        var app = angular.module('plinc', []);

        app.controller('MainCtrl', function($scope, $http) {
        $http({
        url: '{% url 'ajax-view' %}',
        method: "GET"
        }).then($scope.getdata = function(response) {
        alert(data['revenue']);
        $scope.data = response;
        });
        });
        </script>

$（文档）.ready（函数（）{
$.getJSON（“{%url”ajax视图“%”），函数（数据）{
警报（数据['收入]）；
})
})
但是用这种方式在角度上尝试。因为我是新来的。我不能让它工作。
var app=角度模块（'plinc'，[]）；
app.controller（'MainCtrl'，函数（$scope，$http）{
$http({
url:“{%url”ajax视图“%}”，
方法：“获取”
}).then（$scope.getdata=函数（响应）{
警报（数据['收入]）；
$scope.data=响应；
});
});

---

这是完整的django模板：

https xhr回调方法的参数（然后，success，error）应该是回调函数，而不是您所做的表达式。试试这个：

.then(function(response) {
    alert(response['revenue']);
    $scope.data = response;
});

注意：您还可以使用

$http.get（url）

而不是更详细的内容

$http（{'method'：'GET'，'url'：url}）

语法。

Ref，由

注册的回调。then（）

和

.success（）

具有不同的签名：

.success(function(data, status, headers, config) {})
// Here response is like {data:..., status:..., headers:..., config:...}
.then(function(response) {})

因此，您的代码可能是

$http.get('{% url 'ajax-view' %}').then(function(response) {
    alert(response.data.revenue);
    $scope.data = response.data;
});

或

---

在我看来，将django模板与angular一起使用似乎不是一个好主意：（.您可以将django MTV中的模板完全替换为angular模板。var app=angular.module（'plinc'，[]）；app.controller（'MainCtrl'，function（$scope，$http）{$http（{url:'{%url'ajax视图'%}，方法：“GET”}）.then（函数（响应）{alert（响应['revenue]]；$scope.data=response；}）；}）；现在我收到“未定义”的警报，我的模板有重复的内容：（这意味着

response.revenue

未定义。重复内容正是我对问题的评论。我没有检查您的django模板，但似乎也在页面上显示了响应以及角度模板。仅使用其中一个。我对角度模板不熟悉。您能修复该部分吗：）

$http.get('{% url 'ajax-view' %}').success(function(data) {
    alert(data.revenue);
    $scope.data = data;
});