Попытка сделать простую вещь в AngularJS: form->, если вы поставите правильное слово-> появляется кнопка-> вы можете нажать и перейти на другую страницу;

Question

Попытка сделать простую вещь в AngularJS: form->, если вы поставите правильное слово-> появляется кнопка-> вы можете нажать и перейти на другую страницу;

0

Попытка сделать простую вещь в AngularJS: form-> если вы поместите правую кнопку word-> appears->, вы можете щелкнуть и перейти на другую страницу (я не пытался поместить ссылку на кнопку, так как она не появляется даже без ссылки)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="foundation.min.css">
</head>
<body ng-app="myApp">
    <div ng-controller="MyCtrl">
        <input type="text" ng-model="MyCtrl.pass">
        <div class="button" ng-show="kPass">click me</div>
    </div>


<script src="angular.js"></script>
<script src="app.js"></script>

</body>
</html>

и js

angular.module('myApp', [])
    .controller('MyCtrl', MyCtrl)
function MyCtrl($scope){
    $scope.kPass = false;
    $scope.pass = "empty";
    $scope.$watch($scope.pass,function(){
        if($scope.pass == "parola"){
            $scope.kPass = !$scope.kPass;
        }
    })
};

проблема: если я набираю parola, кнопка не появляется, я новичок в java-скрипте. благодаря !

Matei Manolache 27 июнь 2015, в 12:36

Источник

Теги:

angularjs

3 ответа

Ещё вопросы

Milos Mosovsky · Answer 1 · 2015-06-27T08-17-00.000Z

Сначала вы должны прочитать некоторые угловые учебники, у вас есть точный неправильный доступ к области, и вы используете неправильные $ watch

angular.module('myApp', [])
    .controller('MyCtrl', MyCtrl)
function MyCtrl($scope){
    $scope.kPass = false;
    $scope.pass = "empty";
    $scope.$watch('pass',function(){
        if($scope.pass == "parola"){
            $scope.kPass = !$scope.Kpass;
        }
    })
};

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="foundation.min.css">
</head>
<body ng-app="myApp" ng-controller="MyCtrl">
    <div>
        <input type="text" ng-model="pass">
        <div class="button" ng-show="kPass">click me</div>
    </div>


<script src="angular.js"></script>
<script src="app.js"></script>

</body>
</html>

И, наконец, вы переполняете свой код. Вы можете встроить его в шаблон без какой-либо функции контроллера

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="foundation.min.css">
</head>
<body ng-app="myApp">
    <div >
        <input type="text" ng-model="pass">
        <div class="button" ng-show="pass == 'parola' ">click me</div>
    </div>


<script src="angular.js"></script>
<script src="app.js"></script>

</body>
</html>

Также у меня есть еще один быстрый вопрос: если я делаю <div class = "button" ng-show = "pass == 'parola'" href = "secondpage.html"> нажмите меня </ div>, почему это не работает; если я нажму на кнопку, это не приведет меня к другой странице
нет проблем :) Angular требует времени, чтобы понять, но тогда это зверь :) (Это все еще зверь, когда вы не понимаете,
ты видел кнопку с href? :) <a class="button" ng-show="pass =='parola'" href="secondpage.html"> Нажмите меня </a>
@MilosMosovsky кнопки не имеют HREF. Ссылки делают.

JB Nizet · Answer 2 · 2015-06-27T09-12-00.000Z

Здесь есть несколько ошибок.

Во-первых, поле пароля привязано к MyCtrl.pass. Но вы смотрите значение $ scope.pass

Во-вторых, $ scope. $ Watch ожидает, что угловое выражение будет оцениваться как аргумент, а не ценность для просмотра. Поэтому просмотр строки 'MyCtrl.pass' будет правильным.

В-третьих, вы не должны использовать часы вообще. Вы должны просто использовать ng-show="isPasswordValid(pass)" (см. Ниже) и вернуть true или false из этой функции.

В-четвертых, вместо выполнения $scope.kPass = ($scope.pass == "parola") вы инвертируете значение $scope.kPass, но только если это значение верно. Так что, если он исходит из неправильного для правильного, kPass станет истинным. Тогда, если он станет неправильным, kPass останется верным. И если он снова станет правильным, он станет ложным.

Итак, чтобы возобновить, все, что вам нужно, это

<div ng-controller="MyCtrl">
    <input type="text" ng-model="pass">
    <div class="button" ng-show="isPasswordValid(pass)">click me</div>
</div>

а также

$scope.isPasswordValid = function(password) {
    return pass === 'parola';
};

Milos Mosovsky · Answer 3 · 2015-06-27T08-18-00.000Z

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

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
  Please input : 'parola' <input type="text" ng-model="pass">
  <button ng-show="pass == 'parola'">Next step</button>
  </body>