角度/离子回到状态

时间:2016-07-14 09:34:38

标签: javascript angularjs ionic-framework

我有一个文章列表页面,其中包含文章,最新和流行的过滤器。 他们的按钮看起来像在头版:

<a class="button button-icon" href="#" ng-click="articleFilter('latest')"><i class="ion-ios-circle-filled" ng-show="bulletpointLatest"></i> Latest
      </a>
<a class="button button-icon" href="#" ng-click="articleFilter()"><i class="ion-ios-circle-filled" ng-show="bulletpointPopular"></i> Popular
      </a>

我在FrontPageController中设置了过滤器,如下所示:

  .controller('FrontPageController', function($scope, ArticleService, $state, $ionicScrollDelegate, $location, $ionicPosition) {
  ArticleService.all().then(function(data){
    $scope.articles = data;
  });

  $scope.$on('$ionicParentView.afterEnter', function(event, data) {
    if (data.direction == 'back') {
      $scope.doRefresh();
    }
  });

  $scope.bulletpointSiste = true;

  $scope.articleFilter = function(button){
    if (button == "siste"){
      $scope.bulletpointSiste = true;
      $scope.bulletpointPopular = false;
      ArticleService.all().then(function(data){
        $scope.articles = data;
      });
    }
    else {
      $scope.bulletpointSiste = false;
      $scope.bulletpointPopular = true;
      ArticleService.popular().then(function(data){
        $scope.articles = data;
        console.log(data);
      });
    }
  };

  $scope.like = function(article){
    article.like = article.like == 0 ? 1 : 0;
    ArticleService.like(article.id)
  };

  $scope.doRefresh = function (){
    ArticleService.all().then(function(data){
      $scope.articles = data;
    })
    .finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
     });
  };
})

我首页路线的配置是:

.state('main.front', {
    url: '/front',
    views: {
      'content': {
        templateUrl: 'templates/main-front.html',
        controller: 'FrontPageController'
      }
    },
    authenticate: true
  })

在我的文章页面视图中,我尝试使用ng-click返回首页。

<a ng-click="goBack()" nav-direction="back">

在我的文章控制器中,我尝试了离子历史:

$scope.goBack = function(){
    $ionicHistory.goBack()
  };

更新

现在,因为我正在回复文章:

$scope.$on('$ionicParentView.afterEnter', function(event, data) {
    if (data.direction == 'back') {
      $scope.doRefresh();
    }
  });

我需要这样才能更改相似图标的样式,如果他们在文章页面中点击它们就会获得适当的样式。由于doRefresh()函数获取所有最新文章:

$scope.doRefresh = function (){
    ArticleService.all().then(function(data){
      $scope.articles = data;
    })
    .finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
     });
  };

我需要以某种方式使其工作,以便我知道之前的状态是什么,以便我可以在刷新时调用适当的服务,如果用户来自他在热门文章列表中打开的文章,则很受欢迎。 我该怎么做?

1 个答案:

答案 0 :(得分:0)

@Marco:您可以通过输入前视图状态名称将goBack函数更改为以下代码。

var goBack = function() {
   $state.go('VIEW_NAME');//
}

因为我的经验是视图将始终被缓存,除非我们禁用它。

参考here