Question

我的代码中有一个步骤，应用程序将检查用户输入的单词并将其与单词进行比较。我的问题是我的原始代码是javascript，现在我不确定如何为AngularJS设置它。我不得不提出想法，但都没有工作。这是我在controller.js文件中的选项

$scope.addGuess = function()
    {
    $scope.guesses.push($scope.guestGuess);
    $scope.guessed = $scope.guesses.length;
    $scope.correctResult = "You have guessed the correct word. Way to go!";
    $scope.incorrectResult = "Please try again!";
        if ($scope.guess == $scope.wordToGuess)
            {
                $scope.result ="You have guessed the correct word";
                alert(result);  
            }
        else if ($scope.guess == $scope.wordToGuess)
            {
                $scope.result = "Please try again!";
                alert(result);  
            }
    $scope.guess = '';
    }
});

以下是我尝试在HTML文件

上使用的选项

<p align="center" ng-if="guestGuess == wordToGuess">{{correctResult}}</p>
<p align="center" ng-if="guestGuess != wordToGuess">{{incorrectResult}}</p>

这个想法是，在4次用户输掉游戏之后，这个词将被比较一次，比如4次，所以最终我必须添加第二个条件，关于剩下多少选择。

谢谢你们。

对不起，这是代码的其余部分

HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="guessGameApp">
<head>
    <title>Web Manager - AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js" type="text/javascript"></script>
    <script src="js/controllers/app.js" type="text/javascript"></script>
    <script src="js/controllers/maincontroller.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/magicWord.css">
    <!--<script src="js/jquery-1.11.0.min.js"></script>-->
</head>
<body>
<div ng-controller="guessGameController">
    <p>
        <header id="masthead">
            <h2 align="center">{{appTitle}}</h2>
        </header>
    </p>
    <div ng-controller="wordController">
        <p>
            <table align="center" width="300px" height="150px" border="solid 2px">
                <tr>
                    <td id="guessBox">
                        <p align="center"><input value="" type="text" placeholder="Enter Guess" ng-model="guestGuess" /></p>
                        <p align="center">Your guess is: {{guestGuess}}</p>
                    </td>
                </tr>
                <tr>
                    <td id="guessBox">
                        <p align="center"><button ng-click="addGuess()">Click to Check</button></p>
                    </td>
                </tr>
            </table>
            <p align="center" ng-if="guestGuess == wordToGuess">{{correctResult}}</p>
            <p align="center" ng-if="guestGuess != wordToGuess">{{incorrectResult}}</p>
        </p>
        <p>
            <h3>Your guesses so far are: </h3>
            <ul>
                <li ng-repeat="words in guesses">
                    <p>{{words}}</p>
                </li>
            </ul>
            <p>You have guessed:<b>{{guessed}}</b> times out {{allowed}} chances.</p>
            <p>You have <b>{{allowed - guessed}}</b> guesses left.</p>
        </p>
    </div>
</div>
</body>
</html>

app.js

var gameApp = angular.module('guessGameApp', []);

maincontroller.js

var gameApp = angular.module('guessGameApp', []);

gameApp.controller("guessGameController", function($scope)
    {
    $scope.appTitle = "WELCOME TO THE GUESS GAME!";
    });

gameApp.controller('wordController', function($scope)
    {
    $scope.guess = '';
    $scope.guesses = [];
    $scope.guessed= '';
    $scope.allowed = 6;
    $scope.wordToGuess = "Just";


    $scope.addGuess = function()
        {
        $scope.guesses.push($scope.guestGuess);
        $scope.guessed = $scope.guesses.length;
        $scope.correctResult = "You have guessed the correct word. Way to go!";
        $scope.incorrectResult = "Please try again!";
            if ($scope.guess == $scope.wordToGuess)
                {
                    $scope.result ="You have guessed the correct word";
                    alert(result);  
                }
            else if ($scope.guess == $scope.wordToGuess)
                {
                    $scope.result = "Please try again!";
                    alert(result);  
                }
        $scope.guess = '';
        }
    });

Answer 1

我没有在我的控制器文件中比较正确的范围，这是我所做的，现在可以工作。

if ($scope.guestGuess == $scope.wordToGuess)
{
    $scope.result = "You have guessed the correct word. Way to go!";
    alert($scope.result);   
}
else if ($scope.guestGuess != $scope.wordToGuess)
{
    $scope.result = "Please try again!";    
    alert($scope.result);   
}

使用AngularJS设置正确的if语句

1 个答案: