Угловое изменение текста кнопки при нажатии - PullRequest
0 голосов
/ 08 декабря 2018

Я работаю над игрой, в которой мне нужно позволить пользователю выбрать следующий уровень после завершения предыдущего уровня.Это может продолжаться до уровня 7.

Мне нужно иметь возможность изменить текст на кнопке, чтобы указать следующий номер метки до 7.

Итак, в контроллере янужно прочитать текст кнопки, отображаемый ранее, чтобы я мог отобразить следующий номер.

Может кто-нибудь помочь?Вот моя кодовая ссылка кодовая ссылка

и сопровождающий код, который я пробовал до сих пор

<html ng-app="myApp">
  <body ng-controller="myCtrl">
     <div id="nextlevel">
        <h3>Level Completed!</h3>
        <button id="nextplay" ng-model="number" ng-init="buttontext='Level 
        2'">{{buttontext}}</button>
   </div>    
  </body>
</html>

и контроллер -

myApp = angular.module("myApp",[]);

myApp.controller("myCtrl", function($scope){

  document.getElementById("nextplay").addEventListener('click', function() {
        nextlevel.style.display = 'none';
        setTimeout(function() {
          nextlevel.style.display = '';
        }, 500);

        if ($scope.number <=7) {            
           $scope.number = $scope.number + 1;
        }
        el.emit('gameStarted', {});        
    });
  $scope.buttontext = "Level " + $scope.number;
});

Я не уверен, как обновить значение текста кнопки до следующего значения.

1 Ответ

0 голосов
/ 09 декабря 2018

Вот решение и некоторые примечания, на которые я рекомендую обратить внимание:

 <html ng-app="myApp">
  <body ng-controller="myCtrl">
   <div id="nextlevel">
     <h3>Level Completed!</h3>
     <button id="nextplay" ng-click="buttonClicked()">
      Level {{number}}
     </button>
   </div>
  </body>
 </html>


  myApp = angular.module("myApp",[]);

  myApp.controller("myCtrl", function($scope) {
  $scope.number = 1;

  $scope.buttonClicked = function() {
    nextlevel.style.display = 'none';
    setTimeout(function() {
      nextlevel.style.display = '';
    }, 500);
    $scope.number++;
  }
 });
  • Вместо 'addEventListener' в AngularJs есть директива под названием 'ng-click', который вызывает функции, включенные в область $ контроллера.

  • Уровень может быть записан непосредственно в ваш HTML с привязкой к переменной $ scope (называемой' number ').

  • Директива 'ng-init' здесь не нужна.

...