AngularJS代碼不運行和檢查

時收到錯誤消息當我檢查它，有沒有錯誤，它返回什麼的話，顯然不運行：AngularJS代碼不運行和檢查

<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腳本代碼的目的是返回要麼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; 
       } 
      } 
     }; 
    } 

})();

來源

2017-03-16 R.Ovis

：用於顯示信息，你可以寫什麼樣的？您正在初始化的值在文本框中寫入任何內容之前完成。如果我理解這個錯誤，你能爲此創造一個蹲點嗎？ –

@ Vineet Agrawal這正是我想要的頁面顯示：如果用戶在這個地方持有人鍵入「列表逗號分開的菜餚，你通常吃午飯」，他們的午餐名單少於或等於3我應該得到msg1其他msg2所以頁面加載時沒有任何內容被傳遞！當你說「你正在初始化的值是在文本框中寫入任何內容之前完成的」。我有點困惑！請把我當作初學者，並從這個角度幫助謝謝。 –

https://rexie18.github.io/AngularJs-mod1-solution/ –

當我試圖反映你的代碼，我得到function slice() { [native code] } INSI去文本框。正如你已經初始化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>

來源

2017-03-16 19:56:37

謝謝你讓我試試 –

thansk很多這就是我做的 'use strict'; angular.module（'LunchChecker'，[]） .controller（'MyLunchCheckController'，MyLunchCheckController）; MyLunchCheckController。$ inject = ['$ scope']; 函數MyLunchCheckController（$ scope）{ $ scope.MenuInput = []; $ scope.msg1 =「享受！」; $ scope.msg2 =「太多了！」; $ scope.checkInput = function（）{ if（$ scope.MenuInput.split（「，」）。length <= 3）$ scope.values = $ scope.msg1; } else { $ scope.values = $ scope.msg2; –

AngularJS代碼不運行和檢查

回答

相關問題