如何在点击列表中的项目，查看了新的一页的项目？ AngularJS和离子

Question

我有一个项目，其中理想情况下，当点击该项目，将带给我的职位本身的列表。我不知道该怎么做。我尝试在标题内单击，但我认为路线本身并不工作。

出于测试目的，我用一条线在那里工作VIEW，在点击应导致上面的函数。我怀疑问题在于app.js状态，以及如何在$ state.go中定义它。

感谢任何帮助。非常感谢！

使用 'tab.view' 不工作的主列表HTML

<ion-view ng-controller="NavCtrl"> 
    <div class="container posts-page"> 
      <div class="post row" ng-repeat="(postId, post) in posts"> 

    <a ng-click="view()">VIEW</a> <!-- the VIEW when clicked = no actions --> 

JS文件 。

$scope.view = function() { 
     $state.go('tab.posts.view', {postId: postId}); 
    }; 

的app.js状态文件

.state('tab.posts', { 
    url: '/posts', 
    views: { 
    'tab-posts': { 
     templateUrl: 'templates/tab-posts.html', 
     controller: 'PostsCtrl' 

.state('tab.posts.view', { 
    url: '/:postId', 
    views: { 
    'tab-posts':{ 
     templateUrl: 'templates/tab-showpost.html', 
     controller: 'PostViewCtrl' 

Answer 1

有一个工作plunker，展示如何：

.state('tab.posts', { 
    url: '/posts', 
    views: { 
    'tab-posts': { 
     templateUrl: 'tab-posts.html', 
     controller: 'PostsCtrl' 
    }, 
    } 
}) 
.state('tab.posts.view', { 
    url: '/:postId', 
    views: { 
    // here is the issue, instead of this 
    // 'tab-posts':{ 
    // we have to use this 
    'tab-posts@tab':{ 
     templateUrl: 'tab-showpost.html', 
     controller: 'PostViewCtrl' 
    } 

作为代码示例显示，这个问题是，我们必须使用绝对视图命名：

• View Names - Relative vs. Absolute Names

在幕后，每个视图被分配遵循的viewname@statename，viewname表示视图中的指令和国家名称中使用的名称的方案绝对名称是国家的绝对名称，例如contact.item。您也可以选择以绝对语法编写视图名称。

所以，因为我们要瞄准国家tab命名tab-posts我们必须使用绝对命名的视图：'tab-posts@tab'

此外，我们应该通过帖子ID为view()功能，或我们可以直接使用ui-sref

<a ng-click="view(postId)">VIEW</a> 
<a ui-sref="tab.posts.view({postId: postId})">VIEW</a> 

为了完整，有更新视图func，羚牛克文章ID：

$scope.view = function(postId) { 
    $state.go('tab.posts.view', {postId: postId}); 
}; 

一切可以观察到here