Как изменить текст кнопки в зависимости от состояния выбранной вкладки

Question

У меня есть следующий фрагмент HTML, используемый в приложении Angular JS

    <div class="portlet-title tabbable-line">
        <button class="btn btn-sm  green pull-left" ng-click="buildApp(platform)"> {{ getText(platform) }} </button> 
        <ul class="nav nav-tabs ">
            <li class="active">
                <a href="#" data-target="#tab_1_1" data-toggle="tab">iOS</a>
            </li>
            <li>
                 <a href="#" data-target="#tab_1_2" data-toggle="tab">Android</a>
            </li>

        </ul>          
    </div>

Я пытаюсь понять, как установить текст кнопки в зависимости от того, какая вкладка выбрана. Изначально выбрана вкладка iOS, поэтому на кнопке должно быть написано «Build iOS App». Если выбрана вкладка Android, то на кнопке появится надпись «Build Android App». Мне нужно установить переменную платформы в зависимости от состояния вкладки, она должна быть простой, но я не уверен, смогу ли я сделать это с помощью angular.

Answer 1

Вы должны вызывать функцию при смене вкладок, чтобы вы могли сделать это как

<div class="portlet-title tabbable-line">
            <button class="btn btn-sm  green pull-left" ng-click="buildApp(platform)"> {{ btnName }} </button> 
            <ul class="nav nav-tabs ">
                <li class="active">
                    <a href="#" data-target="#tab_1_1" data-toggle="tab" ng-click="btn('iOS')">iOS</a>
                </li>
                <li>
                     <a href="#" data-target="#tab_1_2" data-toggle="tab" ng-click="btn('Android')">Android</a>
                </li>
            </ul>          
        </div>

в контроллере

 $scope.btnName = 'iOS';
$scope.btn = function (name) {
    $scope.btnName = name;
}