Question

Nooby问题在这里。我以JSON格式测试销售数据，并希望使用Angular JS在表中显示数据。

这是Angular Code。

Layout = React.createClass({
  getDefaultProps() {
    /*
     * This will get passed down to whatever React component was passed to
     * Layout via the prop "content"
     */
    return {awesomeness: true}
  },

  render() {
    return (
      <div>
        <header>
          <div className="container">
            <button className="btn btn-sm pull-right"
                    onClick={this.handleLogout}>LogOut
            </button>
          </div>
        </header>

        <div className="container">
          {React.cloneElement(this.props.content, this.props)}
        </div>
      </div>
    );
  }
});

我知道有更好的方法可以做到这一点，但我只是钻研Angular ......继承我的HTML ..

var SalesDataApp = angular.module("SalesDataApp", []);

app.factory("services", ['$http', function ($http) {
var serviceBase = '/api/sales';
var obj = {};
obj.getCustomers = function () {
    return $http.get(serviceBase);
};
return obj;
}]);
app.controller('SalesDataController', function ($scope, services) {
services.getCustomers().then(function (data) {
    alert(JSON.stringify(data));
    $scope.customers = data;
});
});

我做了一个测试，看看角度是否正常工作，这是一个胜利者，但代码不显示任何东西。我究竟在哪里出错？

由于

Answer 1

我在控制器中没有看到任何名为salesData的变量，可能需要在html中将其称为客户。

var SalesDataApp = angular.module("SalesDataApp", []);

同时更改您的应用名称

发件人：

var app = angular.module("SalesDataApp", []);

要

keepAlive

Answer 2

var app = angular.module("SalesDataApp", []);

app.factory("services", ['$http', function ($http) {
  var serviceBase = '/api/sales';
  var obj = {};
  obj.getCustomers = function () {
    return $http.get(serviceBase);
  };
  return obj;
}]);
app.controller('SalesDataController', function ($scope, services) {
  services.getCustomers().then(function (data) {
    console.log(data); //changed
    $scope.customers = data;
  });
});

~~我将.json添加到serviceBase字符串中。我假设您将sales.json文件放在相对于此应用程序的正确位置。~~ 您现在应该在控制台中看到数据。根据它在JSON文件中的格式，它现在也可以在UI中。如果不是，则需要使用控制台中显示的数据结构正确设置$ scope.customers。

Angular JS REST API GET不显示数据

2 个答案: