如何在首次进入页面时显示按钮?

时间:2014-07-05 19:51:35

标签: javascript html angularjs ionic-framework ng-show

我正在使用AngularJS,HTML,Javascript和Ionic来确定在用户第一次进入应用中的特定页面时向用户显示消息的正确方法。此后不应显示此消息。

我目前正在使用按钮显示消息并使用ng-show检查“第一次”标记;这个标志将作为布尔“true”或“false”值存储在本地,我使用window.localStorage来执行此操作。我想知道这种方法是否正确,如果是,那么我控制器中存在的第一次标志的代码片段如下所示:

$scope.getFT = function(){                      
    return window.localStorage['firstTime'] || 0;
};

$scope.setFT = function(value){
    window.localStorage['firstTime'] = 1;                       
};

$scope.checkFT = function(){
    // Checks whether or not this is the first time (FT) the user entered this page
    if(($scope.getFT() === 0 || $scope.getFT() === 'undefined')
    {// This is the first time navigating in this page, show message & set local flag to true
        console.log("checkFT: true, value of FT: " + window.localStorage['FT'] + ', now setting FT to true');
        $scope.setFT(1);
        return true;
    }
    else
    {// Not first time navigating through here, do not show first time message
        console.log("checkFT: false, value of FT: " + window.localStorage['FT']);
        return false;
    }
};

在我的页面上,我有以下按钮,下面有更多代码,如下所示:

<ion-header-bar>
    <!-- some code here -->
<ion-header-bar>

<ion-content>
    <!-- First Time Button -->
    <button ng-show='checkFT()' class="firstTime">
        <img src=".../img/firstTimeImage.png"/>
    </button>

    </ion-scroll>
        <ion-list ng-repeat="i in array">
        <!-- . . . . more code below . . . . -->
        </ion-list>
    </ion-scroll>

</ion-content>

在我的调试窗口中,我看到我的应用程序发现这是我第一次进入该页面,但由于某种原因,该功能在页面加载完成之前被调用了大约9次。它不是任何类型的循环,我有下面的元素列表的代码逻辑,但是该列表独立于按钮,反之亦然。

这就是为什么我想知道,我到底做错了什么?我的逻辑是不正确的,我的方法是完全错误的,还是我是对的,我只是简单地处理浏览器加载多次?

1 个答案:

答案 0 :(得分:0)

您可以创建工厂/服务并设置标记以检查它是否是第一次访问。