使用angular.js点击链接时出现以下错误。
错误：
Error: Could not resolve '.profile?p_i=3' from state 'dashboard.profile'
at Object.t.transitionTo (angularuirouter.js:7)
at Object.t.go (angularuirouter.js:7)
at angularuirouter.js:7
at angularjs.js:146
at e (angularjs.js:43)
at angularjs.js:45
我正在使用角度UI路由器来嵌套视图。我正在解释下面的代码。
profile.html：
<div class="col-lg-12">
<div class="portlet portlet-blue" style="margin-bottom:12px;">
<div class="portlet-body">
<div class="table-responsive dashboard-demo-table">
<table class="table table-bordered table-striped table-hover" id="dataTable" >
<colgroup>
<col class="col-md-1 col-sm-1">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-1 col-sm-1">
</colgroup>
<thead>
<tr>
<th>Sl. No</th>
<th>College Name</th>
<th>Address</th>
<th>Contact No</th>
<th>Edit</th>
</tr>
</thead>
<tbody id="detailsstockid">
<tr ng-repeat="profile in profileData">
<td>{{$index+1}}</td>
<td>{{profile.colg_name}}</td>
<td>{{profile.address}}</td>
<td>{{profile.cont_no}}</td>
<td>
<a ui-sref='.profile?p_i={{profile.profile_id}}'>
<input type='button' class='btn btn-xs btn-green' value='Edit'>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
此文件在dashboard.html页面内绑定，如下所示。
dashboard.html：
<a ui-sref=".profile" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">College profile<span class="caret"></span></a>
<div class="row" style="padding-top:90px;" ui-view>
</div>
loginRoute.js：
var Admin=angular.module('Channabasavashwara',['ui.router']);
Admin.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('/', {
url: '/',
templateUrl: 'dashboardview/login.html',
controller: 'loginController'
})
.state('dashboard', {
url: '/dashboard',
templateUrl: 'dashboardview/dashboard.html',
controller: 'dashboardController'
})
.state('dashboard.profile', {
url: '/profile',
templateUrl: 'dashboardview/profile.html',
controller: 'profileController'
})
})
profileController.js：
var dashboard=angular.module('Channabasavashwara');
dashboard.controller('profileController',function($scope,$http,$location){
var id=gup( "p_i" );
$http({
method: 'GET',
url: "php/profile/readProfileData.php",
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function successCallback(response){
$scope.profileData=response.data;
},function errorCallback(response) {
});
if(id != ''){
$scope.buttonName="Update";
var userdata={'userid':id};
$http({
method: 'POST',
url: "php/profile/editProfileData.php",
data: userdata,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function successCallback(response){
console.log('edited data',response);
$scope.colgname=response.data[0].colg_name;
$scope.address=response.data[0].address;
$scope.contno=response.data[0].cont_no;
},function errorCallback(response) {
});
}else{
$scope.buttonName="Submit";
}
$scope.addProfileData=function(){
if($('#addProfileData')[0].defaultValue=='Submit'){
if($scope.colgname==null){
alert('course name field could not blank');
}else if($scope.address==null){
alert('short name field could not blank');
}else if($scope.contno==null){
alert('semester field could not blank');
}else{
var userdata={'colg_name':$scope.colgname,'address':$scope.address,'cont_no':$scope.contno};
//console.log('userdata',userdata);
$http({
method: 'POST',
url: "php/profile/addProfileData.php",
data: userdata,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function successCallback(response){
console.log('profile',response);
alert(response.data['msg']);
$scope.colgname=null;
$scope.address=null;
$scope.contno=null;
$scope.profileData.unshift(response.data);
},function errorCallback(response) {
alert(response.data['msg']);
})
}
}
if($('#addProfileData')[0].defaultValue=='Update'){
var updatedata={'colg_name':$scope.colgname,'address':$scope.address,'cont_no':$scope.contno,'profile_id':id};
console.log('userupdate',userdata);
$http({
method: 'POST',
url: "php/profile/updateProfileData.php",
data: updateData,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function successCallback(response){
alert(response.data);
$location.path('profile');
},function errorCallback(response) {
alert(response.data);
});
}
}
})
function gup( name ) {
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}
当我点击profile.html页面中的编辑按钮时，此错误即将发生。点击后我需要再次移动到相同的个人资料页面。请帮我解决这个错误。
答案 0 :(得分：2)
轻松说：
相对路径只能在适当的环境中使用...
因此，在状态 'dashboard' 的视图内部：
.state('dashboard', {
url: '/dashboard',
templateUrl: 'dashboardview/dashboard.html',
Namily，在这种情况下，在视图内部＆rsa; dashboardview / dashboard.html＆＃39; - 我们可以使用实际路径：
<a ui-sref='.profile?p_i={{profile.profile_id}}'>
因为它将提供适当的起始部分：
当前状态（
'dashboard'）+相对路径'.profile'==='dashboard.profile'
在任何其他州中，我们会得到相对路径的不同结果。主要针对 NON EXISTING 状态......
EXTEND：让它运行（后来用相对的州名称播放）我建议使用绝对州名：
// instead of this
<a ui-sref='.profile?p_i={{profile.profile_id}}'>
// I'd use this
<a ui-sref='dashboard.profile'>
为了能够使用参数，我们应该使用url param扩展状态定义：
.state('dashboard.profile', {
url: '/profile?profileId',
// or
url: '/profile/:profileId',
templateUrl: 'dashboardview/profile.html',
controller: 'profileController'
然后我们可以像这样传递param
<a ui-sref='dashboard.profile({profileId:profile.profile_id})'>