UI 라우터 이온 카드 목록

Question

이온 div에서 href를 사용할 때 몇 가지 문제가 있습니다. 내가 이온 목록을 사용하는 경우 모든 좋은 일 :

<ion-item class="item-icon-right" ng-repeat="post in posts track by $index" href="#/app/posts/{{post.id}}" track> 

을하지만 사업부에서이 작업을 할 때 - 작동하지 않습니다

<div class="list card" ng-repeat="post in posts track by $index" href="#/app/posts/{{post.id}}" track></div> 

Answer 1

href가 div 내부 사용할 수 없습니다. ng-click을 사용하고 컨트롤러에서 처리하여 문제를 해결할 수 있습니다. 컨트롤러에서

<div class="list card" ng-repeat="post in posts track by $index" ng-click="gotoPost(post.id)" track></div> 

:

$scope.gotoPost(postId){ 
    $location.path('/app/posts/'+postId); 
} 

당신이 해결

Answer 2

를 컨트롤러에 당신이 $location를 주입 네드 것 명심하십시오. 이 : 이것에

$scope.gotoPost(postId){ 
    $location.path('/app/posts/'+postId); 
} 

변경 :

 $scope.gotoPost = function(postid){ 
     $state.go('app.post', {'postId': + postid}); 
    } 

그리고 단지 성가신 될 수있는 모든 장소에서 라우팅 기능을 선언 내 컨트롤러

Answer 3

에 $ 상태를 추가 할 수 있습니다. 이 방법을 대신 사용하십시오.

<div class="list"> 
    <a class="card item" 
    ng-repeat="post in posts track by $index" 
    ui-sref="post({id: 'post.id'})" > 
    <div>{{post.content}}</div> 
    </a> 
</div>