Question

导航栏中有两个按钮，我希望在某个状态下显示

HTML

<ion-view>
    <ion-nav-bar class="bar-positive ">
        <ion-nav-buttons>
            <a class="button" ng-click="usersignin()" ng-show="state=='app.login'">Signup</a>
            <a class="button" ng-click="userlogin()" ng- show="state=='login'">Login</a>
        </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view>
    </ion-nav-view>
</ion-view>

Answer 1

AngularJS为控制器之间基于事件的通信提供$on和$broadcast服务。

首先创建两个$on方法来捕获$ broadcast发送的事件。

<强>控制器

$scope.logged = false;
$scope.$on('logged', function(value) {
    $scope.logged = true;
});
$scope.$on('loggedout', function(value) {
    $scope.logged = false;
});

然后$broadcast发送一个事件。

如果用户已登录，

$rootScope.$broadcast('logged');

如果用户退出，

$rootScope.$broadcast('loggedout');

<强> HTML

<ion-view>
    <ion-nav-bar class="bar-positive ">
        <ion-nav-buttons>
            <a class="button" ng-click="usersignin()" ng-if="logged'">Signup</a>
            <a class="button" ng-click="userlogin()" ng-if="!logged">Login</a>
        </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view>
    </ion-nav-view>
</ion-view>

如果您有任何疑问。请让我知道。谢谢

如何根据状态在离子导航栏中添加按钮

1 个答案: