我试图使用ng-hide来防止返回按钮在主页上显示

Angular JS and Bootstrap 3 I am trying to use ng-hide to prevent a back button from displaying on homepage

本文关键字:按钮 返回 主页 显示 ng-hide      更新时间:2023-09-26

我试图使用ng-hide在网站主页的顶部导航栏中不显示后退按钮。下面是用于按钮的html:

<button type="button" class="navbar-back my-hidden-sm my-hidden-md my-hidden-lg" ng-   hide="false" ng-click="back()"><span class="glyphicon glyphicon-arrow-left"></span>
</button>
在控制器中,我尝试将false定义为:
$scope.showBackButton = function() {
  if ($location.path() === '/') {
      return false;
  } else {
      return true;
  }
};

由于某些原因,后退按钮仍然在主页和其他页面上显示。这也可能是Bootstrap 3的冲突风格,但我想在这里问一下是否有人有任何想法。我对Angular JS和JS都很陌生但昨天有人帮我了但我们还是无法让它不显示在我们定义的主页上

$scope.homeLandingPage = '/';
if ($scope.buyer) {
  $scope.homeLandingPage = '/buyerhome';
} else if ($scope.seller) {
  $scope.homeLandingPage = '/sellerhome';
}

谢谢你的建议!我确实遇到过一些东西说,如果Bootstrap 3有一些样式显示:块,它可能会与ng-hide冲突,但我找不到代码中做的任何东西,除了

div {
display: block;
} 

在Chrome开发工具中显示为用户代理样式表

谢谢你,

特雷福

你试过了吗:

<button type="button" class="navbar-back my-hidden-sm my-hidden-md my-hidden-lg" ng-hide="showBackButton()" ng-click="back()"><span class="glyphicon glyphicon-arrow-left"></span>
</button>

编辑:

在您的showBackButton函数中添加console.log,并验证$location.path()是您所期望的(在本例中为'/'),以及该函数是否被首先调用。

$scope.showBackButton = function() {
  console.log($location.path());
  if ($location.path() === '/') {
      return false;
  } else {
      return true;
  }
};

您应该使用ng-hide="true"ng-show="false"隐藏您的按钮。如果你设置了ng-hide="false"按钮仍然是可见的,因为你有双重否定。

你可以使用ng-show="showBackButton()"