Sposób korzystania z routingu kątowego w celu zagnieżdżenia 3 modeli maszynki do golenia mvc

Question

Chcę mieć widok UserAdmin z rejestracją konta, klasą UserProfile i klasą tożsamości. Używam MVC5 z domyślnym uwierzytelnianiem indywidualnym. Używam interfejsu użytkownika do routingu. Widziałem wiele przykładów przy użyciu viewmodel do przekazania wielu modeli do jednego widoku cshtml. Ale potrzebuję bardziej złożonej konfiguracji. Stworzyłem makietę tego, czego szukam. Jaki jest najlepszy sposób na zrobienie tego.

Oto co moja konfiguracja wygląda

ui trasy

// Default route 
    $urlRouterProvider.otherwise('/Document'); 

    // Application Routes States 
    $stateProvider 
     .state('app', { 
      abstract: true, 
      controller: "CoreController", 
      resolve: { 
       _assets: Route.require('icons', 'toaster', 'animate') 
      } 
     }) 
     .state('app.document', { 
      url: '/Document', 
      templateUrl: Route.base('Document/Index'), 
      resolve: {} 
     }) 
     .state('app.register', { 
      url: '/Register', 
      templateUrl: Route.base('Account/Register'), 
      resolve: {} 
     }).state('app.applicationUser', { 
      url: '/ApplicationUser', 
      templateUrl: Route.base('ApplicationUsers/Index'), 
      resolve: {} 
     }).state('app.role', { 
      url: '/Role', 
      templateUrl: Route.base('Role/Index'), 
      resolve: {} 
    }).state('app.roleCreate', { 
      url: '/RoleCreate', 
      templateUrl: Route.base('Role/Create'), 
      resolve: {} 
    }).state('app.userProfile', { 
     url: '/UserProfile', 
     templateUrl: Route.base('UserProfiles/Index'), 
     resolve: {} 
    }).state('app.userProfileCreate', { 
     url: '/UserProfileCreate', 
     templateUrl: Route.base('UserProfiles/Create'), 
     resolve: {} 
    }).state('app.login', { 
     url: '/Login', 
     templateUrl: Route.base('Account/Login'), 
     resolve: {} 
    }); 
} 

_Layout.cshtml

<div ui-view class="app-container" ng-controller="CoreController">@RenderBody()</div> 

Nawigacja

<li> 
    <a ui-sref="app.userProfile" title="Layouts" ripple=""> 
     <em class="sidebar-item-icon icon-pie-graph"></em> 
     <span>User Profile</span> 
    </a> 
</li> 

Nie mam problemu z używaniem modałów dla widoków Utwórz, Szczegóły, Edytuj, jeśli jest to łatwiejsze rozwiązanie. Jednak nie wiem, jak przekazać wybrany identyfikator z jego właściwości do modalu.

Answer 1

ui-router może pomóc w osiągnięciu tego za pomocą

się.

ui-sref='stateName({param: value, param: value})' 

parameterr obiekt przeszedł wraz z nazwą państwa mogą być dostępne w sterowniku za pomocą $ stateParams

b. W kontrolerze można zrobić coś w rodzaju:

if ($stateParams.id != null) { 
// service call goes here 
} 

c. Trzeba użyć nazwanych widoków Coś

$stateProvider 
    .state('report', { 
    views: { 
     'filters': { ... templates and/or controllers ... }, 
     'tabledata': {}, 
     'graph': {}, 
    } 
    }) 

gdzie

filtry

i

tabledate

to nazwane widoki.

ui-view ma przyzwoitą przykładem dla niego tutaj https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

Btw, proponuję najpierw dowiedzieć się panele, które są dynamiczne (czyli te, których zawartość zmienia się z powodu jakiejś interakcji użytkownika) vs statyczne te (nie zmieniają się po załadowaniu). Powinieneś jedynie patrzeć na ui-views, aby zastąpić dynamiczne części, nie ma sensu komplikować aplikacji, umieszczając wszystko w widoku podrzędnym. Stany mogą bardzo szybko się zagmatwać.

Używam dyrektywy ng-include, aby załadować statyczne widoki w stanie nadrzędnym i definiować tylko stany potomne dla części zmienianych widoków.

<div ng-include="'/MyStaticView'" ng-show="MyCondition == true "></div> 

Answer 2

Wierzę, że odpowiedziałem na twoje pytanie komuś innemu. Chcesz zebrać informacje za pośrednictwem adresu URL, prawda?

Using routes in AngularJS to gather data