ng-repeat没有显示任何值

时间:2016-04-01 13:56:36

标签: javascript angularjs

我正在处理使用AngularJS创建的应用程序,我试图查看从RESTServer使用http get方法收集的数据。

我从一个视图发送GET请求,如果请求成功,则导航到angularJS中的另一个视图。视图共享相同的控制器,我有一个对象放在我试图重复的范围变量中。这是我的控制器。

controller.js

function searchCtrl($state, $scope, $http){

$scope.search;
$scope.responses = [];

$scope.submit = function(){

    if($scope.text){
        $http.get("../backend/index.php/user/searchResult?search=" + $scope.text)
                .then(function successCallback (response) {

                $scope.responses = angular.fromJson(response.data.data);
                console.log(typeof($scope.responses));
                $state.go('home.search');
        });


        //$scope.list.push($scope.text);
        //console.log($scope.list);
        //$state.go('home.search');
    }

    };
    console.log($scope.responses);
}

以下是我发送请求的观点。

view1.html

<div class="row border-bottom">
<nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
    <div class="navbar-header">
        <span minimaliza-sidebar></span>
        <form role="search" class="navbar-form-custom" ng-submit="submit()" ng-controller="searchCtrl">
            <div class="form-group">
                <input type="text" placeholder="SÖK" class="form-control" name="top-search" id="top-search" ng-model="text">
            </div>
        </form>
    </div>
    <ul class="nav navbar-top-links navbar-right">
        <li>
            <a ui-sref="login">
                <i class="fa fa-sign-out"></i> Logga ut
            </a>
        </li>
        <li>
            <a ng-click="$root.rightSidebar = !$root.rightSidebar">
                <i class="fa fa-tasks"></i>
            </a>
        </li>
    </ul>

</nav>

将数据发送到view2.html

view2.html

<div class="wrapper wrapper-content animated fadeInRight" ng-controller="searchCtrl">
<div class="row">
    <div class="col-lg-12">
        <div class="ibox float-e-margins">
            <div class="ibox-content">
                <h2>
                    2,160 results found for: <span class="text-navy" ng-model="search">{{search}}</span>
                </h2>
                <small>Request time (0.23 seconds)</small>
            </div>
        </div>

        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h3>Media</h3>
            </div>
            <div class="ibox-content">
                <table id="search_result1" class="display table table-striped table-responsive" cellspacing="0" width="100%">
                  <thead>
                        <tr>
                            <th>Titel</th>
                            <th>Undertitel</th>
                            <th>ISBN</th>
                            <th>Reg. nr</th>
                            <th>Plats i arkiv</th>
                            <th>Publicister</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="response in responses">
                            <td>{{response}}</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

有人可以解释为什么会这样吗?这不是我的所有代码只是与我的问题相关的代码。

2 个答案:

答案 0 :(得分:1)

问题我猜是$state.go('home.search');,您的控制器正在重置,您可以将对象传递到$state.go('home.search', {obj: responses});,而在新的view中您可以访问相同的内容,因为它们都是相同的控制器。

controller('SameCtrl', function ($state, $scope) {
    $scope.yourFunction = function (obj) {
        $state.go("hom.search", {object: JSON.stringify(obj)});
    }
})
.controller('SameCtrl', function ($state, $scope, $stateParams) {
    if(!$state.params){
        console.log(JSON.parse($state.params.object));
    }
})

答案 1 :(得分:0)

我通过使用$ stateParams解决了这个问题,并将我的两个视图划分为不同的控制器。也许这可以通过使用相同的控制器来实现,但我认为$ stateParams的目的是在视图之间发送数据,我猜它假设它们也有不同的控制器。

这是我的 controller.js 现在

   function MainCtrl($state, $scope) {

  $scope.transportSearch = function(searchString){
        $state.go('home.search', {searchString: searchString });
        console.log(searchString);
    };
}


function SearchCtrl($state, $scope, $http, $stateParams){

    $scope.search;
    $scope.responses = [];
    var searchString = $stateParams.searchString;
    console.log(searchString);  


    $scope.getSearch = function(){

            $http.get("../backend/index.php/user/searchResult?search=" + searchString)
                    .then(function successCallback (response) {

                    $scope.responses = angular.fromJson(response.data.data);

            })

    };
    $scope.getSearch();
}

这是我的 config.js ,我通过网址从MainCtrl发送数据到SearchCtrl

    .state('home.search', {
            url: "/search/:searchString",
            templateUrl: "views/search_results.html",
            data: { pageTitle: 'Search' },
            controller: 'SearchCtrl'
    }