通过单状态AngularJS加载页面

我想创建一个方法，可以加载每个页面的控制器和模板的需求，当路由改变，并使状态url选项有2个参数与第二个可选的，以便其中一个页面可以加载额外的信息在另一个ui-view基于该参数。有人能帮我吗?

Javascript:

.config(function config($stateProvider) {
    $stateProvider.state("index", {
        url:"",
        controller:"FirstCtrl as first",
        templateUrl: "templates/first.html"
    })
    $stateProvider.state("second", {
        url:"/second",
        controller:"SecondCtrl as second",
        templateUrl: "templates/second.html"
    })
    $stateProvider.state("third", {
        url:"/third",
        controller:"ThirdCtrl as third",
        templateUrl: "templates/third.html"
    })
})

试试这个，

$stateProvider
.state('report',{
views: {
  'filters': {
    templateUrl: 'report-filters.html',
    controller: function($scope){ ... controller stuff just for filters view ... }
  },
  'tabledata': {
    templateUrl: 'report-table.html',
    controller: function($scope){ ... controller stuff just for tabledata view ... }
  },
  'graph': {
    templateUrl: 'report-graph.html',
    controller: function($scope){ ... controller stuff just for graph view ... }
  }
}
})

Html

<body>
 <div ui-view="filters"></div>
 <div ui-view="tabledata"></div>
 <div ui-view="graph"></div>
</body>

请参考此链接https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

相关内容

最新更新

热门标签：