wcadap

contactApp.controller('contactController',
    ['$scope', 'contactDataService', '$location',
    function categoryController($scope, contactDataService) {
        $scope.contacts = [];
        
        loadContactData();

        function loadContactData() {
            contactDataService.getContacts()
            .then(function () {

wcadap

using Contacts.Helpers;
using Contacts.Models;
using System.Web.Mvc;

namespace Contacts.Controllers
{
    public class ContactController : JsonController
    {
   	private ContactContext ContactsDB = new ContactContext();
        

wcadap

contactApp.factory('contactDataService', ['$http', '$q',
function ($http, $q) {
    var _contacts = [];
    
    var _getContacts = function () {
        var deferred = $q.defer();
        var controllerQuery = "contact/GetContacts";

        $http.get(controllerQuery)
          .then(function (result) {

wcadap

using Newtonsoft.Json;
using Newtonsoft.Json.Serialization;
using System;
using System.Net;
using System.Web.Mvc;

namespace Contacts.Helpers
{
    public class JsonController : Controller
    {

wcadap

using System.Collections.Generic;
using System.Data.Entity;
using System.Linq;

namespace Contacts.Models
{
    public class ContactContext : DbContext
    {
        public DbSet<Contact> Contacts { get; set; }
    }

wcadap

namespace Contacts.Models
{
    public class Contact
    {
        public int Id {get;set;}
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Email { get; set; }
        public string Mobile { get; set; }

wcadap

bundles.Add(new ScriptBundle("~/bundles/angularApp").Include(
        "~/Scripts/Angular1.3.5/angular.js",
        "~/Scripts/Angular1.3.5/angular-route.js",
        "~/Scripts/Angular1.3.5/angular-resource.js",

        "~/App/contactApp.js",
        "~/App/clientRoute.js",
        "~/App/contact/controller/contactController.js"
        ));

wcadap

contactApp.config(['$routeProvider', function ($routeProvider) {
    
    $routeProvider.when('/', {
        templateUrl: "/app/Home/home.html"
    }),

    $routeProvider.when('/about', {
        templateUrl: "app/Home/about.html"
    }),

wcadap

 <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
        <li><a href="#/">Home</a></li>
        <li><a href="#/mycontacts">My Contacts</a></li>
        <li><a href="#/about">about</a></li>
    </ul>
</div>

wcadap

<div class="panel panel-primary">
    
    <div class="panel-heading">New Contact</div>
    <div class="panel-body">
        <form class="form-horizontal" role="form" id="contactForm" name="contactForm">
            
            <div class="form-group">
                <label for="firstName" class="col-sm-3 control-label">First Name</label>
                <div class="col-sm-6">