根据控制器中的变量显示或隐藏元素 - 离子 [英] Showing or hiding elements based on variables in controller - Ionic

问题描述

就我所知，这可能更像是一个AngularJS问题，而不是一个特定的Ionic问题。我的一个观点中有一个按钮：

For all I know this might be more an AngularJS issue than an Ionic specific one. I have a button in one of my views:

<button class="button button-clear button-block button-positive" ui-sref="register">
    Register
 </button>

在我的控制器中，我有这个变量，我可以从本地存储获得真或假必须隐藏，具体取决于值：

And in my controller I have this variable that I get from local storage that is either true or false and has to be hidden depending that the value is:

app.controller('loginController', ['$scope', '$localstorage',
  function($scope, $localstorage) {

  // Check if the user has already requested a register, and if true, hide
  // the 'Register' button
  if ($localstorage.get("registrationRequested", false) === true) {
    // How do I do this?
  }

}]);

现在第一个问题可能就是操作dom的最佳实践控制器？如果没有，我在哪里以及如何做到这一点？如果它在我的控制器中做得很好，那我该如何引用该按钮并将其隐藏？

Now the first question probably is, is it even a best practice to manipulate the dom like that from my controller? And if not, where and how do I do it? If its' fine doing it in my controller, then how do I reference that button and hide it?

推荐答案

添加 ng-hide 指示按钮标记：

<button ng-hide=registered class="button button-clear button-block button-positive" ui-sref="register">
    Register
</button>

在您的JS文件中，在 $ scope 到 false 并将其设置为 true 以隐藏按钮：

In your JS file, declare this value in your $scope to false and set it to true to hide the button:

app.controller('loginController', ['$scope', '$localstorage',
    function($scope, $localstorage) {
        $scope.registered = false;

        // Check if the user has already requested a register, and if true, hide
        // the 'Register' button
        if ($localstorage.get("registrationRequested", false) === true) {
            $scope.registered = true;
        }
    }
]);

这篇关于根据控制器中的变量显示或隐藏元素 - 离子的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！