Question

我正在努力学习Angular，但我正在尝试创建一个fizzBuzz;我没有得到“两个”条件的结果：

这是应用程序：

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

myApp.controller("game", ["$scope", function($scope) {

$scope.number = 0;
$scope.result = "";

$scope.fizzBuzz = function(){

  if($scope.number){

      if($scope.number % 3 == 0)
      {
        return $scope.result = "Fizz";
      }
      else if($scope.number % 5 == 0)
      {
        return $scope.result = "Buzz";
      }
      else if(($scope.number % 3 == 0) && ($scope.number % 5 == 0))
      {
        return $scope.result = "FizzBuzz";
        alert($scope.result);
      }
  }else{
      return "Enter a Number";
  }

};

}]);

和绑定：

<div ng-controller="game">

<input type="text" ng-model="number">

<h1>{{fizzBuzz(result)}}</h1>

</div>

它无法获得'FizzBuzz'但'Fizz'和'Buzz'..

这适用于普通的js好。我只是看不出这是一个sytax错误..？

直播：http://jsfiddle.net/huguxvmx/1/

Thnx提前！

Answer 1

因为如果以这种方式工作，如果其中一个条件获得成功，那么接下来就不会执行删除else并仅使用或将最后一个检查移到顶部并使用&&执行：

  if(($scope.number % 3 == 0) && ($scope.number % 5 == 0))
  {
    return $scope.result = "FizzBuzz";
    alert($scope.result);
  }
  if($scope.number % 3 == 0)
  {
    return $scope.result = "Fizz";
  }
  if($scope.number % 5 == 0)
  {
    return $scope.result = "Buzz";
  }

Answer 2

你应该设置这个条件

if(($scope.number % 3 == 0) && ($scope.number % 5 == 0))

首先

并替换&上的&&。

这是有效的JSFiddle。

Answer 3

这是在Angular中执行FizzBuzz的另一种方法。只是想我加上我的2美分以防万一有人想以另一种方式做这个练习。

这是HTML：

<!DOCTYPE html>
  <html>

  <head>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script data-require="angular.js@1.3.10" data-semver="1.3.10" src="https://code.angularjs.org/1.3.10/angular.js"></script>
    <script type="text/javascript" src="script.js"></script>
  </head>

  <body ng-app="myApp">
    <h1>FizzBuzz</h1>
    <div ng-controller="myCtrl">
      <div ng-repeat="number in numbers">
        {{ number }} 
        <span ng-if="number%3==0 && number%5!==0" >Fizz</span>
        <span ng-if="number%5==0 && number%3!==0">Buzz</span>
        <span ng-if="number%3==0 && number%5==0">FizzBuzz</span>
      </div>
    </div>
  </body>

</html>

以下是剧本：

angular.module('myApp', [])
.controller('myCtrl', ['$scope', function($scope) {
    function range(start, stop, step){
      var a=[start], b=start;
      while(b<stop){b+=step;a.push(b)}
      return a;
    }
    $scope.numbers = range(1, 100, 1);
}]);

FizzBuzz有棱角吗？

3 个答案:

FizzBu​​zz有棱角吗？

3 个答案:

FizzBuzz有棱角吗？