javascript - 当链接仅为 "#"时，防止路由参数更改 View

Question

我使用 $routeParams 进行以下配置:

controllersModule.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
        when('/home', {
            templateUrl: 'views/home.html',
            controller: 'HomeController'
        }).
        when('/history', {
            templateUrl: 'views/history.html',
            controller: 'HistoryController'
        }).
        otherwise({
            redirectTo: '/home'
        });
    }
]);

效果很好。

但是在我的页面中有一些带有 href="#" 的链接。单击这些链接时，我会看到一个空白页面。
这些链接中的大多数在项目工作时都会消失，因为它们只是占位符，但我仍然很好奇是否有某种方法可以防止这种情况发生。我尝试从“a”标签中删除 href 属性，但这会删除鼠标悬停上的指针(我知道我可以添加一个 css 规则)，但我想要一个可以放入路由中的解决方案

Answer 1

将 # 替换为 javascript:void(0);

当浏览器遵循 javascript: URI 时，它会评估URI，然后用返回的内容替换页面内容值，除非返回值是未定义，这样您的页面保持不变并且不执行任何操作。

对a元素不执行任何操作

<a href="javascript:void(0);">
  Click here to do nothing
</a>

来自 MDN:

Note, however, that the javascript: pseudo protocol is discouraged over other alternatives, such as unobtrusive event handlers.

更新:

对于 ng-href，如果数据来自 $scope，值为 #，则只需将 # 值替换为空字符串，这样页面就不会重定向到任何页面。

内部 Controller :

this.mylink = this.mylink !== '#' ? this.mylink : '';