Как навсегда скрыть кнопку после одного нажатия в AngularJS - PullRequest
Новая
       1

Как навсегда скрыть кнопку после одного нажатия в AngularJS

0 голосов
/ 04 марта 2019

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

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.17/angular.js" data-semver="1.3.17"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <button class="btn btn-primary" ng-click="showDiv=true" ng-show="!showDiv">Start Course</button>
    <button class="btn btn-success" ng-show="showDiv">Resume</button>
  </body>

</html>

контроллер 

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';



});

это моя ссылка на плункер

Ответы [ 2 ]

0 голосов
/ 04 марта 2019

Вы должны использовать localStorage использовать следующие шаги.

1.Установите ngStorage в своем приложении 

npm i ng-storage

2.в своем модуле 

angular.module('app', [
    'ngStorage'
])

3.введите в свой контроллер 

app.controller('MainCtrl', function ($scope, $localStorage) {
    $scope.name = 'World';
    if ($localStorage.showDiv == true) {
        $scope.showDiv = true;
    }else{
        $scope.showDiv = false;
    }
    $scope.hideStart = function(){
       $scope.showDiv = true;
       $localStorage.showDiv = true;
    }
});

4.in html 

<button class="btn btn-primary" ng-click="hideStart()" ng-if="!showDiv">Start Course</button>
0 голосов
/ 04 марта 2019

Проверить плункер: Ссылка плунжера

Вы бы использовали что-то вроде этого:

JS: 

app.controller('MainCtrl', function($scope) {

  $scope.name = 'World';
  $scope.showDiv = false;

  $scope.getItem = function(){
    var stored = localStorage.getItem("showDiv");
    if(stored)
      $scope.showDiv = JSON.parse(stored)
  }

  $scope.saveItem = function(){
    localStorage.setItem("showDiv", true)
  }

  $scope.getItem();

});

И HTML: 

<button class="btn btn-primary" ng-click="showDiv=true; saveItem();" ng-show="!showDiv">Start Course</button>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...