angular.module('WeatherApp', [])
.controller('mainController', ['$scope', function($scope) {
$scope.currentWeather = {
description: 'Moc hezky',
temperature: 24
}
$scope.windSpeed = 20;
}])
.directive('weatherWidget', [function() {
return {
scope: false,
link: function($scope, $elem, $attrs) {
},
template: '<label for="temp">Teplota: </label>' +
'<input type="text" ng-model="currentWeather.temperature" id="temp" name="temp">' +
'<br>' +
'<label for="wind">Rychlost větru: </label>' +
'<input type="text" ng-model="windSpeed" id="wind" name="wind">'
}
}])
<div ng-app="WeatherApp" ng-controller="mainController">
<div class="outer-scope">
<h2>Aktuální počasí: {{currentWeather.description}}</h2>
<p>Je {{currentWeather.temperature}} stupňů, s rychlostí větru {{windSpeed}} m/s.</p>
</div>
<weather-widget></weather-widget>
</div>