Javascript 使用angular.js ui路由器单击链接时出错

我在使用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

我在嵌套视图中使用angular UI router。我的代码如下：

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>

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页面中的编辑按钮时，这个错误就来了。我需要移动到相同的个人资料页后再次点击

有

简单地说：

相对路径只能在适当的上下文中使用

因此，在状态“仪表板”的视图中：

.state('dashboard', {
    url: '/dashboard',
    templateUrl: 'dashboardview/dashboard.html',

在本例中，在视图“dashboardview/dashboard.html”的内部，我们可以使用realtive path：

<a ui-sref='.profile?p_i={{profile.profile_id}}'>

为了能够使用参数，我们应该使用url参数扩展状态定义：

.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})'>

---

@Ramdim:那么我将更改什么，以便它能够按照要求工作。我将从绝对名称
'dashboard.profile'
开始，检查我的扩展答案…@Ramdim:我将在
ui sref=“dashboard.profile”
中编写这个，对吗？你知道吗？我甚至创建了一个plunker来向你展示-相对路径和绝对路径。。。这应该给你现在的答案；）
// instead of this
<a ui-sref='.profile?p_i={{profile.profile_id}}'>
// I'd use this
<a ui-sref='dashboard.profile'>

.state('dashboard.profile', {
        url: '/profile?profileId',
        // or
        url: '/profile/:profileId',
        templateUrl: 'dashboardview/profile.html',
        controller: 'profileController'

<a ui-sref='dashboard.profile({profileId:profile.profile_id})'>