如何使用 angular.js $http 获取结果？

Question

我在使用 angularjs 从我的 api 服务器获取结果时遇到了一些问题。

这是我的代码：

home.html（查看）

<div class="jumbotron text-center">
        <h1>Home Page</h1>

        <p>{{ message }}</p>

        <a href="#" ng-click="getOrders()">Orders!</a>
</div>
<ul>
    <li ng-repeat="order in orders">{{order}}</li>
</ul>

main.js（控制器）

app.controller('mainController', function($scope, $http) {
    $scope.message = 'Everyone come and see how good I look!';
    $scope.orders = [];
    $scope.getOrders = function(){
        $http.get('http://apidemo.dev/api/orders').success(function(response){
            console.log("My data: " + response);
            $scope.orders = response;
        });
    }
});

当我点击按钮时，我可以在控制台中看到结果，但在列表中看不到。

如果在控制器中使用此代码，它会在加载时运行，并且在我单击按钮时运行：

app.controller('mainController', function($scope, $http) {
    $scope.message = 'Everyone come and see how good I look!';
    $http.get('http://apidemo.dev/api/orders').success(function(response){
        console.log("My data: " + response);
        $scope.orders = response;
    });
    $scope.getOrders = function(){
        $http.get('http://apidemo.dev/api/orders').success(function(response){
            console.log("My data: " + response);
            $scope.orders = response;
        });
    }
});

有什么问题？

谢谢！

Answer 1

感谢大家的帮助。

问题是视图中的 link...

<a href="#" ng-click="getOrders()">Orders!</a>

将是：

<a ng-click="getOrders()">Orders!</a>

Answer 2

好像你在使用 ngRoute 并且你的锚点中有 href="#"，这会导致你重定向到空白页面，保留 href="" 将帮助你进入 css在鼠标悬停时显示 pointer: cursor;

按钮

<a href="" ng-click="getOrders()">Orders!</a>

如何使用 angular.js $http 获取结果？

How to get results with angular.js $http?

anchor

routing

angularjs

angularjs-routing