angular directives revised

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@1.5.0" data-semver="1.5.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
   <script src="script.js"></script>
  </head>

  <body ng-app="myApp">

    <div ng-controller="main">
  <my-todo list="todo" title="Angular To-do"></my-todo>
    </div>

  </body>
</html>

// Code goes here
var app = angular.module('myApp', []);

app.directive('myTodo', function(){
    return {
      restrict: 'EA',
      templateUrl: 'todo.tpl.html',
      scope: {
        list: '=',
        title: '@'
      }
    };
  });


app.controller('main', function($scope){
  $scope.todo = [
    {name: 'Create a custom directive', completed: true},
    {name: 'Learn about restrict', completed: true},
    {name: 'Master scopes', completed: false}
  ];
});

<h1>{{title}}</h1>
<div ng-repeat="todo in list">
  <input type="checkbox" ng-model="todo.completed"> {{todo.name}}
</div>