Question

我是Angular的新手，我无法将我的下拉选项映射到浏览器URL（基于下拉选项的动态）。

例如，浏览器网址为＆＃34; / home？color = Red＆amp;＆amp; size = Large＆＃34;。当我将此URL粘贴到新选项卡中时，我希望颜色和大小下拉列表已被选为红色和大号。我该怎么做？

我的AngularJS控制器代码：

String pictureName = output.image_name_profile;
String packageName = context.getPackageName();

if(!pictureName.equals("default")){
    resId = context.getResources().getIdentifier("drawable/" + pictureName, null, packageName);
    image = context.getResources().getDrawable(resId);
        }

上述功能的AngularJS服务：

$scope.getResults = function() {

    server.getResults($scope.myColor, $scope.mySize)
    .success(function(data) {
        results = data;

        $scope.myColor = $location.search('color', $scope.myColor);
        $scope.mySize = $location.search('size', $scope.mySize);
    });
};

Angular中的ui-router：

app.factory('server', ['$http', function($http){
    return { 
        getResults : function(color, size) {
            var req = {};
            req.color = color;
            req.size = size;

            return $http({
                method: 'GET', 
                url: 'results',
                params : req
            });
        }
    }
}]);

Answer 1

检查此解决方案

Angular中的ui-router：

 $stateProvider.state('home', {
        url: '/home/:color/:size',
        templateUrl: '/home.html',
        controller: 'MainCtrl',
        reloadOnSearch: false
    })

    myApp.controller('MainCtrl', function($scope, $stateParams)
   {  
        $scope.color=$stateParams.color;
         $scope.size=$stateParams.size;
   });

查看

var params= { size:'24', color:red };
$state.go('home', params);

映射下拉列表选择URL

1 个答案: