Question

我在下面有以下HTML。我使用AngularJS作为框架，我将从开启切换到关闭和返回。我现在的问题是如何关闭和打开两个按钮 - 是否可以只在html中执行它还是需要在控制器中处理它？

<div ng-click="vm.makeSomethingInController(scheduleResponseContent)" ng-show="vm.changeService"> 
    <button class="btn btn-xs btn-default" >ON</button>
    <button class="btn btn-xs btn-primary active">OFF</button>
</div>

控制器中的功能：

function setTriggerForLoadingOriginalSchedule(scheduleResponseContent) {
        vm.schedulepresenceonly = !vm.schedulepresenceonly;
        loadScheduleResponseOfUser(getCurrentDate(), '', vm.viewType, true, scheduleResponseContent.institutionUserConnectionId);
    }

非常感谢！

Answer 1

您可以使用ng-hide和ng-show

像这样

<button ng-show="schedulepresenceonly" class="btn btn-xs btn-default" >ON</button>
<button ng-hide="schedulepresenceonly" class="btn btn-xs btn-primary active">OFF</button>

或仅ng-if

喜欢这个

<button ng-if="schedulepresenceonly" class="btn btn-xs btn-default" >ON</button>
<button ng-if="!schedulepresenceonly" class="btn btn-xs btn-primary active">OFF</button>

Answer 2

纯粹取决于您的问题域或 域名为您提出的问题 例如，我有问题域说当用户将点击 ON 按钮，他/她进入不同的路径（页面视图），如果是OFF按钮，则路由到不同的路径（页面视图）。

实施例，

在HTML中

<button class="btn btn-xs btn-default" data-ng-click="success()">ON</button>
<button class="btn btn-xs btn-default" data-ng-click="failure()">OFF</button>

在控制器

中

$scope.success = function(){
     <---Put Your Code--->
     console.log('Success Path');
     $location.url('/success');   
}

$scope.failure = function(){
     <---Put Your Code--->
     console.log('Failure Path');
     $location.url('/failure');   
}

HTML或Controller中的按钮切换

2 个答案: