Question

我想创建一个方法，可以根据需要加载每个页面的控制器和模板，当路由更改并使状态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"
    })
})

Answer 1

试试这个，

JS

$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

通过单个状态AngularJS加载页面

1 个答案: