Select .state on page reload using angular-ui-router

128 views
Skip to first unread message

Nikola Radisic

unread,
Mar 6, 2015, 8:38:52 AM3/6/15
to ang...@googlegroups.com
I am developing a ASP.NET MVC 5 application. I am loading a partial view through angular `'ui.router'` on a `div` in a parent page. Routing is working great until I refresh the page - than a partial view is loading on a whole page but I want it to still load as a partial or to send a user to, for example a home page.

This is my code. A parent view, FirstPage.cshtml:

    <html ng-app="myApp">
    <head>
        <base href="/">
        <title>First Page</title>
        <script src="/Scripts/Angular/angular.js"></script>
        <script src="/Scripts/Angular/angular-ui-router.js"></script>
        <script src="/Scripts/app.js"></script>
    </head>
    <body>
        <h1>First Page</h1>
        <ul id="myMenu">
            <li ui-sref="customer">Customer</li>
        </ul>
        <div ui-view="containerOne"></div>
    </body>
    </html>

This is my app.js:

    var myApp = angular.module("myApp", ['ui.router']);

    var proposalConfig = function ($stateProvider, $locationProvider) {

    $locationProvider.hashPrefix('!').html5Mode(true);

    $stateProvider
        .state('customer', {
            url: 'Proposal/Customers',
            views: {
                "containerOne": {
                    templateUrl: '/Proposal/Customers'
                }
            }
        });
    }

    proposalConfig.$inject = ['$stateProvider', '$locationProvider'];

    myApp.config(proposalConfig);

My RouteConfig.cs:

    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

    routes.MapRoute(
        name: "ProposalCustomers",
        url: "Proposal/Customers",
        defaults: new { controller = "Proposal", action = "Customers" });

    routes.MapRoute(
        name: "Default",
        url: "{controller}/{action}/{id}",
        defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional });

My ProposalController.cs:

    public ActionResult Customers()
    {
        return View();
    }

My Views/Proposal/Customers.cshtml:

    <h2>Customer list</h2>

I hope my problem is clear.
Reply all
Reply to author
Forward
0 new messages