Click here to Skip to main content
15,924,367 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
i am learning mvc
i downloaded code tried to implement same but in my application on click in anchor tag it is redirecting to page
but same code js when I am pasting in downloaded solution it is working
so is there any DLL or same think need to added to work routing in angular Js

Index.html
Razor
@{
    ViewBag.Title = "Index";
}
<script type="text/javascript" src="@Url.Content("~/Scripts/angular.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/angular-route.min.js")"></script>
<script src="~/Scripts/Home/Module.js"></script>
<script src="~/Scripts/Home/Services.js"></script>
<script src="~/Scripts/Home/ManageUserController.js"></script>
<body data-ng-app="UserModule">
    
        <h2>Manage User</h2>
        <a href="ManageUser">Manage</a>
    
        <div data-ng-view></div>
    </body>


ManageUser.cstml
HTML
<table>
    <tr>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Role</th>
        <th>Edit</th>
    </tr>

    <tr data-ng-repeat="user in users">
        <td>
            {{user.FirstName}}

        </td>
        <td>
            {{user.LastName}}

        </td>
        <td>
            {{user.RoleName}}

        </td>
        <td></td>
    </tr>
</table>


Module.js

JavaScript
var app = angular.module("UserModule", ["ngRoute"]);

app.factory("ShareData", function () {
    return { value: 0 }
});

app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    
    $routeProvider.when('/ManageUser',
                       {
                           templateUrl: 'Home/ManageUser',
                           controller: 'ManageUserController'
                       });
  
    $routeProvider.otherwise(
        {
            redirectTo: '/'
        }
        );
    $locationProvider.html5Mode(true).hashPrefix('!')
}]);


Services.js

JavaScript
app.service('SPAUserServices', function ($http) {

    this.getUsers = function () {
        return $http.get('/Home/GetUsers')
    };

});


ManageUserController.js

JavaScript
app.controller('ManageUserController', function ($scop, $location, SPAUserServices, ShareData) {
    getUserbind();
    function getUserbind() {
        var dataload=SPAUserServices.getUsers();
        dataload.then(function (pl) { console.write(pl.data); $scop.Users=pl.data},
            function (errorpl)
            {
                $scop.error = errorpl;
                console.write(errorpl);
            }
            );

    }
});


HomeController.cs

C#
public class HomeController : Controller
   {
       public ActionResult Index()
       {
           return View();
       }

       public JsonResult GetUsers()
       {
           return Json(new List<UserModel> {
               new UserModel { UserID = 1, FirstName = "Sushant", RoleName = "Admin" }
           ,   new UserModel { UserID = 2, FirstName = "Nilesh", RoleName = "User" }

           },JsonRequestBehavior.AllowGet);
       }

       public ActionResult ManageUser()
       {
           return PartialView("ManageUser");
       }
   }

   public class UserModel
   {
       public int UserID { get; set; }
       public string FirstName { get; set; }
       public string LastName { get; set; }
       public int strRoleID { get; set; }
       public string RoleName { get; set; }
   }
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900