Question

当我检查它时，没有任何错误，它没有返回任何内容，显然没有运行：

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles/bootstrap.min.css">
<style>
.message {
    font-size: 1.3em;
    font-weight: bold;
}
</style>
<script src="angular.min.js"></script>
</head>

<body ng-app='LunchChecker'>
    <div class="container" ng-controller='MyLunchCheckController'>
        <h1>Lunch Checker</h1>
        <div class="form-group">
            <input id="lunch-menu" type="text" placeholder="list comma separated dishes 
                 you usually have for lunch" class="form-control" ng-model='MenuInput'>
        </div>
        <div class="form-group">
            <button class="btn btn-default" ng-click="checkInput()">
                Check If Too Much</button>
        </div>
        <div class="form-group message" {{checkInput()}}>
            <!-- Your message can go here. -->
        </div>
    </div>
    <script src="app.js"></script>
</body>

</html>

以下是上述视图的app.js脚本，如果输入小于3，则代码的目的是返回msg1;如果输入小于3，则返回msg2 3：

(function() {
    'use strict';

    angular.module('LunchChecker', [])
        .controller('MyLunchCheckController', MyLunchCheckController);

    MyLunchCheckController.$inject = ['$scope'];

    function MyLunchCheckController($scope) {
        $scope.MenuInput = [].slice;
        $scope.values = new Array($scope.MenuInput.length);
        $scope.msg1 = "Enjoy!";
        $scope.msg2 = "Too much!";

        //fucntion for the button to check the user input menu-list

        $scope.checkInput = function() {
            for (var i = 0; i < $scope.values; i++) {

                if ($scope.values <= 3) {
                    return $scope.msg1;
                } else {
                    return $scope.msg2;
                }
            }
        };
    }

})();

Answer 1

当我尝试反映您的代码时，我在文本框中收到function slice() { [native code] }。正如您已将MenuInput的值初始化为[] .slice。

所以要改进和比较代码

'use strict';

angular.module('LunchChecker', [])
  .controller('MyLunchCheckController', ['$scope', function($scope) {
    $scope.msg1  =   "Enjoy!";
     $scope.msg2  =   "Too much!";

     $scope.checkInput  =  function() {
            if($scope.MenuInput.split(",").length <= 3) {
                $scope.values = $scope.msg1;
            } else{
                $scope.values = $scope.msg2;
            }
    };   
  }]);

它将根据您比较的长度在控制台中打印消息。要显示消息，您可以这样写：

<div class="form-group message" {{checkInput()}}>

到

<div class="form-group message"> {{values}}</div>

AngularJS代码未运行，并且在检查时未收到任何错误消息

1 个答案: