當用戶從下拉列表中選擇一個選項時，如何更改按鈕上的文本？ （angular.js）

Question

我正在寫一個angular.js和bootstrap的網頁，我有一個完全像this one 的組件。當用戶展開菜單並選擇操作時 - 我想更改按鈕上的文本。到目前爲止，我的代碼如下：

<div class="btn-group"> 
    <button type="button" class="btn btn-danger" ng-click="queryUsers()">Show data from last hour</button> 
    <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"> 
     <span class="caret"></span> 
     <span class="sr-only">Toggle Dropdown</span> 
    </button> 
    <ul class="dropdown-menu" role="menu"> 
     <li><a ng-click="queryUsersFromYesterday()">Show data from yesterday</a></li> 
     <li><a ng-click="queryUsersFromLastWeek()">Show data from last week</a></li> 
     <li><a ng-click="queryUsersFromLastMonth()">Show data from last month</a></li> 
    </ul> 
</div> 

當用戶點擊眼下：從上週的數據顯示 - 菜單消失，但按鈕還具有文本：從最後一小時的數據顯示。我怎樣才能動態地改變按鈕上的文字？

Answer 1

我會保持範圍內的一個標誌，這隻會一次設置爲true

<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" ng-click="buttonClicked = true;"> 
    <span ng-class="buttonClicked? 'caret': 'sr-only'" 
     ng-bind="buttonClicked? 'Toggle Dropdown': 'Toggled'"> 
    </span> 
</button>