Question

我正在创建一个角度应用，我需要每个用户都有自己独立的页面。

 localhost/{username}

下面的

是我的路由参数，

app.config(function($routeProvider) {
$routeProvider

  .when('/', {
    templateUrl : '../../views/index_old.html',


  })

  .when('/email/signup', {
    templateUrl : '../../views/emailsignup.html',
    controller  : 'myCont'

  })

  .when('/email/code/', {
    templateUrl : '../../views/emailcode.html',
    controller  : 'codeCheck'

  })

  .when('/user/basic/', {
    templateUrl : '../../views/basicInfo.html',
    controller  : 'userbasicInfo'

  })

  .when('/user/location/', {
     templateUrl : '../../views/userLocation.html',
     controller  : 'userLocation'

   })

});

我无法在网址中传递用户名。有没有办法做到这一点。

Answer 1

你可以创建类似的路线：

 app.config(function($routeProvider) {
  $routeProvider

  .when('/:username', {
   templateUrl : '../../views/index_old.html'

  }).when('/userprofile/:profileID', {
   templateUrl : '../../views/index_old.html'

  })
})

Answer 2

你应该使用$routeProvider这样的东西：

.when('aboutMe/:userId', {          
        templateUrl: "app/aboutMe/aboutMe.html",
        controller: "exerciseEditCtrl",
        resolve: 
            selectedUser:['UserResourceFactory','$routeParams',function(exerciseResourceFactory, $stateParams){
                return UserResourceFactory.get({id: $routeParams.userId} );
            }]
        }
    });

此路线将在网址中包含userId作为参数。因此，我使用resolve来获取使用名为UserResourceFactory的服务的用户信息，这将确保在启动控制器之前获取用户信息。在你的控制器中，你将有一个selcetedUser作为参数，如下所示：

app.controller('AboutMeCtrl, ['$scope', 'selectedUser',function($scope, selectctedUser){//your controller to user selectedUserData } ]);

如果不清楚，请告诉我。干杯。

Answer 3

您可以在配置文件中添加路由参数，如下所示

app.config(function($routeProvider) {
$routeProvider

  .when('/', {
    templateUrl : '../../views/index_old.html',
  })
.when('/email/signup', {
    templateUrl : '../../views/emailsignup.html',
    controller  : 'myCont'
})
.when('/email/code/', {
    templateUrl : '../../views/emailcode.html',
    controller  : 'codeCheck'
})
.when('/user/basic/userId', {
    templateUrl : '../../views/basicInfo.html',
    controller  : 'userbasicInfo'
    params:{
        userId:null
    }
  })
  .when('/user/location/', {
     templateUrl : '../../views/userLocation.html',
     controller  : 'userLocation'
   })
});

假设此控制器 codeCheck 对应于登录页面

angular.module('').controller('codeCheck',function($scope,$location,appVariables){
        //your code for the controller

        $scope.userId= appVariables.user;

        login=function(){
        $location.path('/user/basic/'+ userId);
        }

});

angular.module('yourModule').factory('appVariables',function(){
    //Your application variables
    var userId=0;
    return{
    userId:userId,
}
});

处理 userbasicInfo 控制器

中的用户对象

angular.module('').controller('userbasicInfo',function($scope,$http,appVariables){
        //your code for the controller

        //API call using $http to get the corresponding user details with the help of the user Id 

});

在角度js中添加URL中的id

3 个答案: