AngularJS：单击活动选项卡会删除位置哈希标签。

12 浏览
0 Comments

AngularJS：单击活动选项卡会删除位置哈希标签。

在ui-router动态创建的链接被浏览器跟随之前，我想要验证某个条件。我查看了$rootscope.$on('$stateChangeStart', ..)，但是我无法从那里访问controller.$scope。我还需要在应用程序的几个地方使用这个，并且会很麻烦。请记住，ui-sref与ui-sref-active相连（一起工作），所以我不能删除ui-sref，并通过$state.$go('some-state')在ng-click中调用一个函数来使用。条件应该在一个$scope函数内评估，并且在on-click事件（在转换之前能够取消它）中。我需要像这样的东西：

  • 前往某个状态

    • 我尝试过：

  • 前往某个状态

  • 前往某个状态

    • 还有：

  • 前往某个状态

    • 甚至：

  • 前往某个状态

    • 但是都不起作用。

    0

    3 答案

    0 Comments

    问题的出现原因是当点击活动标签时，会移除位置哈希标签。解决方法是使用一个作用域函数来返回一个状态，如果返回的是一个现有的状态字符串，则会创建href属性。此外，还可以使用ng-if指令来判断验证条件并显示对应的标签。如果使用checkCondition()方法，可能会导致控制台报错。为了避免错误，可以在$rootScope上注册一个$stateNotFound事件，并在事件处理函数中阻止对'-'状态的解析。另外，也可以将checkCondition()方法放在href属性中，并在返回之前使用$state.href()方法进行处理。

    0
    0 Comments

    问题的原因是点击活动标签会删除位置哈希标签。解决方法是创建一个指令来中断最终改变状态的事件链。该指令还可以阻止在相同元素上执行ng-click。以下是相关的javascript代码：

    module.directive('eatClickIf', ['$parse', '$rootScope',
  function($parse, $rootScope) {
    return {
      // this ensure eatClickIf be compiled before ngClick
      priority: 100,
      restrict: 'A',
      compile: function($element, attr) {
        var fn = $parse(attr.eatClickIf);
        return {
          pre: function link(scope, element) {
            var eventName = 'click';
            element.on(eventName, function(event) {
              var callback = function() {
                if (fn(scope, {$event: event})) {
                  // prevents ng-click to be executed
                  event.stopImmediatePropagation();
                  // prevents href 
                  event.preventDefault();
                  return false;
                }
              };
              if ($rootScope.$$phase) {
                scope.$evalAsync(callback);
              } else {
                scope.$apply(callback);
              }
            });
          },
          post: function() {}
        }
      }
    }
  }
]);

    以下是相关的html代码：

  • 
  Go Somestate

    •

    相关链接：[PLUNKER](http://plnkr.co/edit/AKQasLfnvZFkKdHz3nEQ?p=preview)

    还有一些评论提到了其他更简单、有效和通用的处理方法，但这个方法是一种可行的解决方案。

    0
    0 Comments

    问题原因：点击活动标签会移除URL中的哈希标签。

    解决方法：使用条件语句来实现路由。

     Conditional Link

    这个解决方法可以在不改变指令、作用域等的情况下，通过条件语句实现路由。

    0