使用网址

Question

我有一个简单的表单，可用于发起预测请求。我将其创建为父状态requests（启动预测）。

期望的行为

1. 提交请求时，该立即请求将以子状态（查看状态）显示为最近的请求。此View Status状态还将保存所有过去请求的网格，这意味着每次调用此状态时，我将使用数据刷新网格。
2. 父状态和子状态均可从侧边栏菜单中导航。
3. 因此，如果用户点击父级（启动预测），他应该只能看到提交请求的表单。如果用户直接点击查看状态＆＃39;（子），那么他应该能够看到请求的表单和网格。

  

app.js

function statesCallback($stateProvider) {
  $stateProvider
    .state('requests', {
    url: '',
    views: {
      'header': {
        templateUrl: 'initiateforecasting.html',
        controller: 'requestsInitiateController'
      },
      'content': {
        template: '<div ui-view></div>'
      }
    },
    params: {
      fcId: null,
      fcIndex: null
    }
  })
  .state('requests.viewStatus', {
    url: '/ViewStatus',
    templateUrl: 'viewstatus.html',
    controller: 'requestsStatusController'
  });
}

var requestsApp = angular.module('requestsApp', ['ui.router']);
requestsApp.config(['$stateProvider', statesCallback]);
requestsApp.run(['$state', function($state) {
  $state.go('requests');
}]);

Plunker of my attempts so far。

这一切都适用于我，如plunker所示，但我这样做是因为没有设置父级的URL。没有父状态的URL允许我看到两个状态。如果我将URL添加到父状态，则单击“查看状态”链接不会在任何地方（它保持在“启动”）。

如何更改此设置以便我可以拥有父状态的URL并仍然保留我需要的父/子状态行为，如上所述？

注意：我没有独立示例代码中的父状态URL，但是当我将此部分与后端代码集成时，父状态上没有URL片段正在向服务器发出不必要的请求。当我导航到子状态然后转到父状态时，这是可见的。它有效地给人一种重新加载页面的印象，我认为这是不必要的，如果URL可以设置为父状态，则可以避免。

Answer 1

使用ui.router时不要直接写url，请尝试这样：

<a ui-sref="requests.viewStatus">View Status</a>

您正在ui-sref指令中编写州名，它会自动解析网址。它非常舒服，因为您可以随时更改网址，也不会破坏导航。