UI路由器$ state.go VS UI的SREF是让我坚果AngularJS [英] ui-router $state.go VS ui-sref is making me nuts in AngularJS

问题描述

它的工作原理时，通过用户界面，SREF

称为

 ＆LT;一类=按钮UI-SREF =main.create＆GT;
 

但是，当它使用一个名为NG-点击和$ stage.go，这就是所谓的并呈现页面，但我的$ urlRouterProvider.otherwise将再次重写DOM。我注意到它时，我调试一步一步来。它也许认为main.create是一个不存在的网址。

这里是code和功能NG-点击。

 ＆LT; A HREF =＃NG点击=创建（）＆GT;创建对象＆LT; / A＆GT;
 

和这里创建（）函数

  $ scope.create =功能（）{
  $ state.go（'main.create'）;
};
 

它调用的 $ state.go（'主'）在 NG-点击=创建（）用来。但它调用之前 $ state.go（'主'），我看到正确的main.create页面呈现在DOM。我写的IF语句来处理不存在的URL，这样他们重定向回到主页。这是我的config.js。

  .STATE（'主'，{
    网址：'/'，
    观点：{
      '@'：{
        templateUrl：应用程序/主/ main.html中，
        控制器：'MainController
      }，
      内容主要@：{
        templateUrl：应用程序/主/ main.display.html
      }
    }
  }）  .STATE（'main.create'，{
    网址：'/创建，
    观点：{
      内容主要@：{
        templateUrl：应用程序/主/ main.create.html
      }
    }
  }）  $ urlRouterProvider.otherwise（函数（$喷油器）{
  VAR会话= $ injector.get（会议）;
  变量$状态= $ injector.get（'$状态'）;
  如果（Session.isAuthenticated（））{
    $ state.go（'主'）; //＆LT;  - 这就是被调用时使用NG-点击后main.create部分被渲染
  }其他{
    $ state.go（'登录'）;
  }
}）;
 

解决方案

这是发生，因为你是触发操作，并在同一个锚标记的路由。在＆LT; A HREF =＃NG点击=创建（）＆GT; ，你不需要两个的href 和 NG-点击是present。将其更改为＆LT;一个NG点击=创建（）＆GT; ，或者具有href是必要的，将其设置为空，如＆LT; A HREF =NG点击=创建（）＆GT;

。

It works when called via ui-sref

<a class="button" ui-sref="main.create">

but when it's called using ng-click and $stage.go, it's called and renders the page but my $urlRouterProvider.otherwise will override the DOM again. I noticed it when I debugged step by step. It maybe thinks that main.create is a non-existent url.

here is the code and function for ng-click.

<a href="#" ng-click="create()">Create Object</a>

and here is create() function

$scope.create = function() {
  $state.go('main.create');
};

It's calling $state.go('main') when ng-click="create()" is used. But before it calls $state.go('main'), I see the proper main.create page render in DOM. I wrote that "IF" statement to handle non-existent url so they get redirected back to main page. Here is my config.js.

  .state('main', {
    url: '/',
    views: {
      '@': {
        templateUrl: 'app/main/main.html',
        controller: 'MainController'
      },
      'content@main' : {
        templateUrl: 'app/main/main.display.html'
      }
    }
  })

  .state('main.create', {
    url: '/create',
    views: {
      'content@main' : {
        templateUrl: 'app/main/main.create.html'
      }
    }
  })

  $urlRouterProvider.otherwise(function ($injector) {
  var Session = $injector.get('Session');
  var $state = $injector.get('$state');
  if (Session.isAuthenticated()) {
    $state.go('main'); // <-- this is what gets called when using ng-click and after main.create partial gets rendered
  } else {
    $state.go('login');
  }
});

解决方案

This is occurring because you are triggering an action and a route on the same anchor tag. In <a href="#" ng-click="create()">, you don't need both href and ng-click to be present. change it to <a ng-click="create()">, or if having the href is necessary, set it to empty, like <a href="" ng-click="create()">.

这篇关于UI路由器$ state.go VS UI的SREF是让我坚果AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！