我有一个简单的 onsen-ui 示例页面。它使用 Onsen UI 1.0.4在 Monaca ( http://monaca.mobi ) 中构建。
该页面包含两个 onsen-ui 按钮（ons-button），它们的可见性通过 angular js 绑定了一个 javascript 方法。这些按钮是互斥的，这意味着当按钮 1 可见时，按钮 2 必须隐藏 - 反之亦然。
单击任一按钮时，会更改内部标志并显示另一个按钮。
问题是：页面首次加载时按钮的可见性未正确应用。它仅在用户手动单击其中一个按钮时才有效。
作为一个反例，页面上还有两个普通的 HTML 按钮——这些按钮在页面加载后就可以正常工作。
你能给我什么建议吗？加载页面时是否必须手动强制刷新？
非常感谢您！
HTML 代码：
<div ng-controller="AppCtrl">
<strong>Click To Toggle</strong> <br>
<button ng-click="startTracking()" ng-hide="isTrackingRunning()"><strong>On</strong></button>
<button ng-click="stopTracking()" ng-show="isTrackingRunning()"><strong>Off</strong></button>
<ons-button ng-click="startTracking()" ng-hide="isTrackingRunning()">Start Tracking</ons-button>
<ons-button ng-click="stopTracking()" ng-show="isTrackingRunning()">Stop Tracking</ons-button>
</div>
JS代码：
angular.module('SotraMon', ['onsen.directives'])
.controller('AppCtrl',['$scope', function($scope){
var trackingRunning = false;
$scope.isTrackingRunning = function() {
console.log("getter called, returning " + trackingRunning);
return trackingRunning;
}
$scope.startTracking = function() {
trackingRunning = true;
}
$scope.stopTracking = function() {
trackingRunning = false;
}
}]);