How to access a specific $scope variable when load

First of all, sorry about the title, I just wan't sure how to word this question.

So I'm making a task manager using AngularJS. I have a form for the user to fill with the details when he's creating a new task. I use ng-model to save these values to my $scope. Here's how I save them:

$scope.add = function(tasks)
{
    {
        $scope.tasks.push({
            'id': tasks.id,
            'title': tasks.title,
            'start_day': tasks.start_day,
            'start_time':tasks.start_time,
            'start_date':tasks.start_day + " " + tasks.start_time,
            'end_day': tasks.end_day,
            'end_time': tasks.end_time,
            'end_date':tasks.end_day + " " + tasks.end_time,
            'type': tasks.type,
            'description': tasks.description
        });
        localStorage.setItem('tasks',JSON.stringify($scope.tasks));
    }
};

Then, as you can see, I save these values to the local storage. I have an array called tasks with all the tasks the user created. I then display these tasks in a table with this:

<table id="datatable" class="display" ng-cloak>
    <thead>
    <tr>
        <th><b>ID</b></th>
        <th><b>Title</b></th>
        <th><b>Start Date</b></th>
        <th><b>End Date</b></th>
        <th><b>Type</b></th>
        <th></th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="task in tasks track by $index">
        <td ng-click="details(task)">{{task.id}}</td>
        <td ng-click="details(task)">{{task.title}}</td>
        <td ng-click="details(task)">{{task.start_date}}</td>
        <td ng-click="details(task)">{{task.end_date}}</td>
        <td ng-click="details(task)">{{task.type}}</td>
        <td><a ng-click="remove(task)" class="btn-floating waves-effect waves-light red<i class="material-icons">clear</i></a></td>
    </tr>
    </tbody>
</table>

Then, the objective is that you can click any row and load a new page with all the task details. I do this with the function details(), which has the following code:

$scope.details = function (task)
{
    $window.location.href = 'table.html';
}

This loads the file table.html and what I want is to display in this page all the task details, i.e., the ID, the title, the description, etc.

What I don't know is how to only display the specific task that you click on. For example, if I click on the row with the task "Todo #1", I only want to see the details for the task "Todo #1".

to access this variable in other html you can use factory or service like this

(function() {
"use strict";
angular.module('dataModule',[])
.factory('datafactory',function(){
return {

};
});
})();

Now datafactory is factory we need to inject this module(dataModule) in your module and factory(datafactory) in controller

Now how to use this factory in your function

$scope.details = function (task)
{
datafactory.currentTask =task
$window.location.href = 'table.html';
}

Now this datafactory stores your variable that can we used in any controller and later on also you can use this factory to store any such variable for global use like this datafactory.Myvariable ="hasd"//assign here

Now to use this variable Suppose you want to use this variable in another page table.html there on

// in html ng-init ="$scopeInit()"

in controller
$scopeInit =function(){
$scope.localTask =datafactory.currentTask
}
and use $scope.localTask

suppose html looks something like this

<div ng-controller ="my-controller" ng-init ="$scopeInit()">
<table id="datatable" class="display" ng-cloak>
<thead>
<tr>
<th><b>ID</b></th>
<th><b>Title</b></th>
<th><b>Start Date</b></th>
<th><b>End Date</b></th>
<th><b>Type</b></th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="task in tasks track by $index">
<td ng-click="details(task)">{{task.id}}</td>
<td ng-click="details(task)">{{task.title}}</td>
<td ng-click="details(task)">{{task.start_date}}</td>
<td ng-click="details(task)">{{task.end_date}}</td>
<td ng-click="details(task)">{{task.type}}</td>
<td><a ng-click="remove(task)" class="btn-floating waves-effect waves-light red<i class="material-icons">clear</i></a></td>
</tr>
</tbody>
</table>

<div>

//in controller

$scopeInit =function(){
$scope.task =datafactory.currentTask
}

//$scope.task contains required array and hence table can be created