javascript – 提交后显示来自http请求的嵌套结果

我的页面上有一个文本框,用户输入他们想要搜索用户名,然后单击提交按钮.我想要实现的是当用户点击提交按钮时,结果应立即推送到页面.
使用我的脚本它所做的只显示一个结果,即使可能有10个或更多

JS

.controller('search_ctrl',['$scope','$http','$location','$ionicLoading','$ionicPopup','$state','$stateParams','$cordovaToast',function($scope,$http,$location,$ionicLoading,$ionicPopup,$state,$stateParams,$cordovaToast){
    $scope.username=localStorage.getItem("username");
    $scope.searchresults = [];


        $scope.expendsearch=function() {
        $ionicLoading.show({template: '<p>Please Wait...</p><ion-spinner></ion-spinner>'});
        event.preventDefault();
        $http.post("http://localhost/app/templates/spree/sales/expenses/search_results.PHP",{'username':$scope.username})
        .success(function(data){
        //console.log(JSON.stringify(data));
        $scope.results=data;
        {$ionicLoading.hide();}

        var search ={"fullname":data[0].reciever,"username":data[0].amount};
        $scope.searchresults.push(search);
        }).error(function(error){
        console.error(error);
        });
        }


}])

HTML

<div ng-controller="search_ctrl" ng-repeat="item in searchresults track by $index">
{{item.username}}
{{item.fullname}}
</div>

当我将我的脚本更改为:

.controller('search_ctrl',$cordovaToast){
        $scope.username=localStorage.getItem("username");
        $scope.searchresults = [];


            $scope.expendsearch=function() {
            $ionicLoading.show({template: '<p>Please Wait...</p><ion-spinner></ion-spinner>'});
            event.preventDefault();
            $http.post("http://localhost/app/templates/spree/sales/expenses/search_results.PHP",{'username':$scope.username})
            .success(function(data){
            //console.log(JSON.stringify(data));
            $scope.results=data;
            {$ionicLoading.hide();}

            var search ={"fullname":data.reciever,"username":data.amount};
            $scope.searchresults.push(search);
            }).error(function(error){
            console.error(error);
            });
            }


    }])

页面上没有任何内容

解决方法

如果第一个脚本显示一个结果,我假设您的数据采用格式

[{reciever:'aaa',amount:'bbb'},{reciever:'ccc',amount:'ddd'} ....]

所以你可以做$scope.searchResults = data;

并在HTML中,做

<div ng-controller="search_ctrl" ng-repeat="item in searchresults track by $index">
{{item.reciever}}
{{item.amount}}
</div>

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...