In Django framework first, we create the project in your Django server and add all javascript and CSS and jquery file in your HTML page and then create function.
Follow these step shown below
Step1- First we create a project in your Django server like as project name is django_angular-master and then setup all file.
Use this link given below
http://findnerd.com/list/view/How-to-create-project-in-dijango-1-4/15788
Step2- Than we create javascript file in your project and than main.js file in your javascript file.
Use this code given below
var module = angular.module("sampleApp", ['ngRoute']);
module.controller('MainCtrl', function ($scope) {
$scope.showModal = false;
$scope.toggleModal = function(){
$scope.showModal = !$scope.showModal;
};
});
Step 3- Than we create templates folder in your project and than create html file in your templates folder like as login.html file.
Use this code given below
<!DOCTYPE html>
{% load staticfiles %}
<html lang="en">
<head>
<title>AngularJS Routes example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-route.min.js"></script>
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static 'angularapp/css/style.css' %}" />
<script src="{% static "angularapp/js/app.js" %}"></script>
<script src="{% static "angularapp/js/jquery.timeago.js" %}"></script>
</head>
<body ng-app="sampleApp">
<div ng-controller="MainCtrl">
<div class="container" id="header">
<a id="demo" style="text-decoration:none; color:green; width:185px; float: right; margin-top: 13px;"></a>
<script>
var time = new Date();
var date =new Date();
var month = new Array();
month[0] = "January";
month[1] = "February";
month[2] = "March";
month[3] = "April";
month[4] = "May";
month[5] = "June";
month[6] = "July";
month[7] = "August";
month[8] = "September";
month[9] = "October";
month[10] = "November";
month[11] = "December";
var n = date.getDate();
var year = date.getFullYear();
time = time.toLocaleString('en-US', {date:'dd-mm-ss', hour: 'numeric', minute :'numeric', hour12: true });
document.getElementById("demo").innerHTML = month[date.getMonth()] +", "+ n +" "+year+" "+time;
</script>
</div>
</body>
0 Comment(s)