Это мой взгляд:
<!doctype html>
<html lang="en" ng-app="LunchCheck">
<head>
<title>Lunch Checker</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="angular.min.js"></script>
<script src="app.js"></script>"
<link rel="stylesheet" href="styles/bootstrap.min.css">
<style>
.message { font-size: 1.3em; font-weight: bold; }
</style>
</head>
<body>
<div class="container" ng-controller="LunchCheckController">
<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="input">
</div>
<div class="form-group">
<button class="btn btn-default" ng-click="stack()">
Check If Too Much
</button>
</div>
<div class="form-group message" id="result">
<!-- Your message can go here. -->
{{message}}
</div>
</div>
</div>
</div>
</body>
</html>
Это мой JS:
(function() {
'use strict';
angular.module('LunchCheck', [])
.controller('LunchCheckController', LunchCheckController);
LunchCheckController.$inject = ['$scope'];
function LunchCheckController ($scope) {
$scope.input = "";
$scope.message = "";
$scope.stack = function($scope, input) {
var array = $scope.input.split(',');
if (array.length <= 3) {
$scope.message = "Enjoy";
} else if (array.length > 3){
$scope.message = "Please stop!";
} else ($scope.input == " " || Null ) {
$scope.message = "Please enter something."
}
};
}
};
}
})();
Мои проблемы в основном начинаются всякий раз, когда я пытаюсь использовать:
else ($scope.input == " " || Null ) {
$scope.message = "Please enter something."
}
Я начинающий, но я не уверен, что делаю не так. Извините, если это грязно, я, вероятно, слишком много вставлял и редактировал.
В основном, когда я пытаюсь открыть его в своем браузере, я получаю двойные фигурные скобки под моим окном ввода, говорящие {{ message }}