Question

来自首页的用户，从下面的列表中选择城市，并根据搜索产品显示。

但是在显示的每个产品之后，页面重新加载和城市选择变为第一个城市，用户需要再次选择城市进行每次搜索。

需要帮助如何克服此问题并将城市设置为用户选择，而不是每次都刷新。

//Define an angular module for our app
var app = angular.module('myApp', ['ui.bootstrap']);

app.controller('autocompleteController', function($scope, $http) {

    $scope.cities = [
        {name: 'London'},
        {name: 'Paris'},
        {name: 'Newyork'},
    ];
    $scope.selectedCities = $scope.cities[0];
    var initalizeproduct = function() {
        $scope.products = $http.get("/getproduct/"+$scope.selectedCities.name).success(function(data){
            $scope.products = data.products;
        });
    }
    initalizeproduct($scope.products);
    $scope.changeCity = function() {
        initalizeproduct();
    }
    $scope.onSelectPart = function (item) {
        $scope.selectedproducts = item;
        window.location.href = "/product/"+$scope.selectedproducts.fields.slug;
    };

});

来自HTML页面：

<select ng-model="selectedCities" ng-change="changeCity()" ng-options="cities.name for cities in cities" style="background :transparent; border:0px; outline: none;">
            </select>

Answer 1

将window.location.href = "...";替换为：

$http
    .get("/product/"+$scope.selectedproducts.fields.slug)
    .then(function( ̶d̶a̶t̶a̶ response) {
       var data = response.data; 
       // Get the HTML part from 'data' that you would like to display and add it to DOM
    });

开头。

每个页面上的选定城市更改刷新，需要再次设置

1 个答案: