<!DOCTYPE html>
<html ng-app="agendaEditor">
<head>
	<meta charset="UTF-8">
	<title>AgendaEditor</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
	<link rel="stylesheet" href="css/style.css">
	<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-route.min.js"></script>
	<script src="app.js"></script>
	<script src="services/agenda.js"></script>
	<script src="home/home.js"></script>
	<script src="result/result.js"></script>
	<script src="import/import.js"></script>
	<script src="about/about.js"></script>
	
</head>
<body>
	<nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">
            <span class="sr-only">Menu</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">AgendaEditor</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li><a href="#home">Home</a></li>
			<li><a href="#result">Result</a></li>
            <li><a href="#import">Import</a></li>
            <li><a href="#about">About</a></li>
          </ul>
        </div>
      </div>
    </nav>
	
	<div id="main">
		<div ng-view></div>
	</div>
	
</body>
</html>
var app = angular.module('agendaEditor', ['ngRoute']);


app.config(function($routeProvider) {
	$routeProvider
		.otherwise({
			redirectTo: '/home',
			controller: 'homeController'
		});
});

body {
  padding-top: 70px;
}
<div class="container">
	<div class="row">
		<div class="col-sm-8">
			<div class="form-group col-sm-2 col-sm-offset-9">
				<label>Start time</label>
				<input type="text" class="form-control" ng-model="agenda.startTime">
			</div>
			<table class="table">
				<tr>
					<td class="col-sm-5">Title</td>
					<td class="col-sm-2">Name</td>
					<td class="col-sm-2">Surname</td>
					<td class="col-sm-2">Time</td>
					<td class="col-sm-1"></td>
				</tr>
				<tr ng-repeat="item in agenda.list" ng-click="$last && addEmptyItem()">
					<td><input class="form-control" type="text" ng-model="item.title"></td>
					<td><input class="form-control" type="text" ng-model="item.name"></td>
					<td><input class="form-control" type="text" ng-model="item.surname"></td>
					<td><input class="form-control" type="text" ng-model="item.time"></td>
					<td><button ng-if="!$first" type="button" class="btn btn-danger btn-xs" ng-click="agenda.list.splice($index, 1)">-</button></td>
				</tr>
			</table>
			<button type="button" class="btn btn-primary" ng-click="addEmptyItem()">Add</button><br />
		</div>
		<div class="col-sm-4">
			<h3>Agenda</h3>
			<div class="panel panel-default">
				<div class="panel-body">
					<span ng-repeat="item in agenda.myResult() track by $index">{{item}}<br /></span>
				</div>
			</div>
		</div>
	</div>
</div>
angular.module('agendaEditor')

	.config(function($routeProvider) {
		$routeProvider
			.when('/home', {
				templateUrl: 'home/home.html',
				controller: 'homeController'
			});
	})

	.controller('homeController', function($scope, Agenda) {
		$scope.agenda = Agenda;
		
		$scope.addEmptyItem = function(){
			Agenda.list.push({title: "", name: "", surname: ""});
		};
	});
<div class="container">
	Tu będzie import.
</div>
angular.module('agendaEditor')

	.config(function($routeProvider) {
		$routeProvider
			.when('/import', {
				templateUrl: 'import/import.html',
				controller: 'importController'
			})
	})
	
	.controller('importController', function($scope) {

	});
<div class="container">
O aplikacji.
</div>
angular.module('agendaEditor')

	.config(function($routeProvider) {
		$routeProvider
			.when('/about', {
				templateUrl: 'about/about.html',
				controller: 'aboutController'
			})
	})
	
	.controller('aboutController', function($scope) {

	});
angular.module('agendaEditor')

	.config(function($routeProvider) {
		$routeProvider
			.when('/result', {
				templateUrl: 'result/result.html',
				controller: 'resultController'
			});
	})

	.controller('resultController', function($scope, Agenda) {
		$scope.agenda = Agenda;
	});
app.service('Agenda', function () {
	this.list = [];
	this.list.push({title: "", name: "", surname: "", time: ""});
	
	this.startTime = "";

	this.myResult = function () {
		var result = [];
		
		if(this.startTime !== "") {
			var lastTime = this.startTime;
			for (var i = 0; i < this.list.length; i++) {
				if(this.list[i].title !== "" && this.list[i].time  !== "" && this.list[i].time !== undefined){
					var endTime = addTime(lastTime, this.list[i].time);
					var concat = lastTime + "–" + endTime + " „" + this.list[i].title + "” – " + this.list[i].name + " " + this.list[i].surname;
					result.push(concat);
					lastTime = endTime;
				}
			}
		}
		return result;
	};
		
	function addTime(start, time) {
			var now = new Date();
			now.setHours(start.split(":")[0]);
			now.setMinutes(start.split(":")[1]);
			now.setHours(now.getHours()+parseInt(time.split(":")[0]));
			now.setMinutes(now.getMinutes()+parseInt(time.split(":")[1]));
			var hours = (now.getHours()<10?'0':'') + now.getHours();
			var minutes = (now.getMinutes()<10?'0':'') + now.getMinutes();
			return hours + ":" + minutes;
	};
    
});
<div class="container">
	<h3>Agenda</h3>
	<div class="panel panel-default">
		<div class="panel-body">
			<span ng-repeat="item in agenda.myResult() track by $index">{{item}}<br /></span>
		</div>
	</div>
</div>