Здравствуйте. Учу Angular по урокам. Нужно чтобы по клику на кнопку, значение, которое находится в инпуте присваивалось переменной name и отображалось вместо Hello World! Но что-то не присваивается ничего, помогите!
<!doctype html>
<html lang="en" ng-app="Application">
<head>
<meta charset="utf-8">
<title>Google Phone Gallery</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script>
var moduleMain = angular.module("Application", []);
moduleMain.controller("Ctrl", function($scope) {
$scope.helloName = "Hello World"
$scope.name = $scope.helloName;
$scope.mainFunction = function() {
$scope.name = $scope.text;
}
})
</script>
</head>
<body>
<div ng-controller="Ctrl">
<h1>{{name}}</h1>
<input type="text" ng-model="text">
<input type="button" value="Press it!" ng-click="mainFunction">
</div>
</body>
</html>
Подскажите, что не так?