Question

我把控制器和控制器分开了服务到模块，在表单提交，我试图从服务获取数据，然后在范围内设置它，但我无法使用新数据更新视图。我已经遇到了类似问题的其他问题，但我似乎无法让它发挥作用。视图从Search.get（）函数更新，但不是从$ scope.submitFilterForm函数更新。

我试图像这样更新：

$scope.searchDetails = results;

这是我目前的代码：

SearchCtrl.js

angular.module('SearchCtrl', []).controller('SearchController', function($scope, $http, Page, Search) {

    $scope.pageClass = 'page-search';
    $scope.showContent = false;
    $scope.searchDetails = [];

    Search.get().success(function(searchResults) {
        $scope.searchDetails = searchResults;
        Page.setTitle('Search');
        $scope.showContent = true;
    });

    $scope.submitFilterForm = function(isValid) {
        if (isValid) {

            Search.filterByPostcode($scope.postcode, $scope.searchradius).success(function(results) {
                console.log('results', results);
                $scope.searchDetails = results;
            });

        }
    }

});

SearchService.js

angular.module('SearchService', []).factory('Search', ['$http', function($http) {

    return {

        get: function() {
            return $http.get('/api/places');
        },

        filterByPostcode: function(postcode, searchradius) {
            return $http.get('/api/filter-by-postcode/'+postcode+'/'+searchradius);
        }

    }

}]);

search.html

<div class="places-list" ng-show="showContent">
    <div class="places-list-item" ng-repeat="place in searchDetails">
        <a href="/place/{{place.id}}">{{place.place_name}}</a>
    </div>
</div>

我也在appRoutes.js中设置了上面的模板，如下所示：

$routeProvider

        // home page
        .when('/search', {
            title: 'Search',
            templateUrl: '/partials/search.html',
            controller: 'SearchController'
        })

$locationProvider.html5Mode(true);

感谢您的帮助。

服务后更新$ scope for ng-repeat

0 个答案: