AngularJS $ http.get请求不在Ionic中显示数据

时间:2017-07-21 22:42:15

标签: javascript angularjs ionic-framework angularjs-http

我是AngularJS的新手,在使用几个youtube教程中显示的命令并阅读文档后,我似乎无法使用$ http.get()请求获取API上显示的数据。

JavaScript和HTML代码:

img_gray = cv2.imread(input_file,cv2.IMREAD_GRAYSCALE)
ret,thresh = cv2.threshold(img_gray,254,255,cv2.THRESH_BINARY) =
kernel = np.array(cv2.getStructuringElement(cv2.MORPH_RECT, (3, 3), (-1, -1)))
img_open = cv2.morphologyEx(thresh, cv2.MORPH_OPEN, kernel)
cv2.imshow('abc',img_open)
ret1,thresh1 = cv2.threshold(img_open,254,255,cv2.THRESH_BINARY_INV) #
contours, hierarchy = cv2.findContours(thresh1, cv2.RETR_CCOMP ,cv2.CHAIN_APPROX_NONE)

for i in range(len(contours)):
    if len(contours[i]) > 20:
        x, y, w, h = cv2.boundingRect(contours[i])
        cv2.rectangle(img, (x, y), (x+w, y+h), (0, 255, 0), 2)
        print (x, y),(x+w, y+h)
<Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:text="Button"
    tools:layout_editor_absoluteX="148dp"
    tools:layout_editor_absoluteY="231dp" />

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

exampleApp.controller('exampleController', function($scope, $http){
  
  $scope.getData=function(){
      $http.get("https://p3ddibjuc6.execute-api.us-west-2.amazonaws.com/prod/entries")
    .success(function(data){
      $scope.Date= data.Date;
      $scope.message= data.message;
    })
    .error(function(data){
      alert("error");
    })
  };
} );

2 个答案:

答案 0 :(得分:1)

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

exampleApp.controller('exampleController', function($scope, $http){

  $scope.getData=function(){
      $http.get("https://p3ddibjuc6.execute-api.us-west-2.amazonaws.com/prod/entries")
    .then(function(response){
      var data = response.data;
      $scope.Date= data.items[0].Date;
      $scope.message= data.items[0].message;

//for iterate do somethin lik this
      $scope.info = data.items;
    })
    .catch(function(response){
      alert("error");
    })
  };
});

如果您想要第一个日期和消息我想要所有。 你需要在你的html中使用ng-repeat来迭代来自api的数据。

在html中

<div ng-repeat="item in info"> 
Date: {{item.Date}}
message: {{item.message}}
</div>

答案 1 :(得分:0)

使用ng-repeat directive显示数据列表:

/proc/self/fd/2

不推荐使用stderr <div ng-repeat="item in Items"> Date: {{item.Date | date}} <br> MESSAGE: {{item.message}} </div> 方法。而是使用̶.̶s̶u̶c̶c̶e̶s̶s̶̶.̶e̶r̶r̶o̶r̶

.then

DEMO

&#13;
&#13;
.catch
&#13;
  $http.get(url)
    .then(function(response){
      var data = response.data;
      $scope.Items = data.Items;
  })
    .catch(function(response){
      console.log("error: ",response.status);
  })
&#13;
&#13;
&#13;