Javascript AngularJS ui路由器使用$state.params和查询导航状态

Javascript AngularJS ui路由器使用$state.params和查询导航状态,javascript,angularjs,angular-ui-router,Javascript,Angularjs,Angular Ui Router,我有一个具有多个状态的应用程序,每个状态都有嵌套视图。一个状态有一个条件模板URL,并且基于$state.param将显示特定的HTML/JS。我想在状态的URL上设置一个查询,这样我就可以在单击列表项时知道正在查看哪个列表项。我不知道如何设置url查询并转换到所需状态的视图 我国: .state('index', { url: '/', views: { '@' : { templateUrl: 'vie

我有一个具有多个状态的应用程序,每个状态都有嵌套视图。一个状态有一个条件模板URL,并且基于
$state.param
将显示特定的HTML/JS。我想在状态的URL上设置一个查询,这样我就可以在单击列表项时知道正在查看哪个列表项。我不知道如何设置url查询并转换到所需状态的视图

我国:

 .state('index', {
        url: '/',
        views: {
            '@' : {
                templateUrl: 'views/layout.html'
            },
            'top@index' : {
                templateUrl: 'views/top.html',
                controller: function($scope, $state) {
                    $scope.logOut = function() {
                        $state.go('login');
                    };
                }
            },
            'left@index' : { templateUrl: 'views/left.html' },
            'main@index' : { templateUrl: 'views/main.html' }
        }
    })
    .state('index.list', {
        url: 'list?item',
        templateUrl: 'views/lists/list.html',
        controller: 'ListCtrl'
    })
    .state('index.list.details', {
        url: '/',
        params: {
            detail: 'overview'
        },
        controller: ctrl,
        views: {
            'details@index' : {
                templateUrl: function($stateParams) {
                    if($stateParams.detail === 'status' ) {
                        ctrl = 'StatusCtrl';
                        return 'views/details/status.html';
                    } else if ($stateParams.detail === 'overview') {
                        ctrl = 'OverviewCtrl';
                        return 'views/details/overview.html';
                    }
                }
            }
        },
    })
在我的
index.list
控制器中,这里有列表,单击并填充详细信息视图

HTML&Js:

<div class="channel" ng-repeat="item in items" ng-click="viewListDetails(item)">

$scope.viewListDetails = function(item) {
    $location.search('item', item.id);
    $state.go('index.list.details', {detail: 'status'}, {reload: true})
};

$scope.viewListDetails=函数(项){
$location.search('item',item.id);
$state.go('index.list.details',{detail:'status'},{reload:true})
};
上面的我的JS运行函数,但是它什么也不做!它不会将查询或转换设置为该状态所需的视图


感谢您的帮助

index.deviceList.detail
不是已定义的状态。您可能打算编写
index.list.details

哎呀,这是我在复制粘贴到堆栈溢出中的输入错误,感谢您指出这一点。您应该调试代码,并查看单击时
templateUrl
返回的内容,或者如果函数被调用,则返回事件。还有那些
ctrl='OverviewCtrl'看起来不正确,因为未定义
ctrl
。控制台中有错误吗?@koox00没有,根本没有错误!!将其放入application.run=>
$rootScope.on(“$stateChangeError”,console.log.bind(console))要记录转换错误,可能会以静默方式失败。