ng-hide，如何通过url扩展有条件地显示有角度的东西

ng hide, how to conditionally show something in angular with url extension

本文关键字：显示 何通过 url 有条件 扩展 ng-hide      更新时间：2023-09-26

我正在测试和应用程序，想做一些非常简单的事情。我想隐藏一个div，只在向url添加扩展时在浏览器中显示它。例如：

<div ng-hide="true" class="cookie-banner">
   Warning you about cookies
</div>

我可以通过添加-->来查看隐藏的div？show=cookie横幅到url，所以本地网站喜欢：/webapp/#/subscribed不会显示隐藏的div，但/webapp/#/已订阅？show=cookie横幅。我不确定我在做什么来让这件事成功。救命！

您可以在控制器中或在您创建的自定义指令中使用angular$location服务，您可以根据$location设置逻辑$$absUrl值。

//in your controller
app.controller('SomeController', ['$scope', '$location', 
  function ($scope, $location) { 
    $scope.hideBasedOnUrl =  $location.$$absUrl.indexOf('show=cookie-banner') !== -1;                 
  }]);
//html
<div ng-hide="hideBasedOnUrl " class="cookie-banner">
  Warning you about cookies
</div>

//in a directive
app.directive("hideBasedOnUrl", function ($location) {
return {
    restrict: "E",
    link: function (scope, element, attrs, ngModelCtrl) {
        if ($location.$$absUrl.indexOf('show=cookie-banner') !== -1){
          element.style.display = "none";
        }   
    }
}
});
//html
<div hideBasedOnUrl class="cookie-banner">
  Warning you about cookies
</div>

有了这个指令，你可以做一些更高级的事情，比如在html中传递url值，作为隐藏div的属性

希望这能有所帮助！

我强烈建议不要使用您的url作为在Angular中传递参数的一种方式。您要查找的功能应该包含在控制器中。

相关文章：