Question

是否可以将templateUrl参数传递给.state选项卡定义，类似于以下内容？我有多个不同的页面要编写，并且不希望在单个模板中使用一堆嵌套的ng-ifs来解析哪些＆＃34; html＆＃34;页面显示：

  .state('tab.menu', {
      url: '/menu',
      views: {
        'tab-menu': {
          templateUrl: 'templates/tab-menu.html',
          controller: 'MenuCtrl'
        }
      }
    })
.state('tab.menu-detail', {
  url: '/menus/:menuID',
  views: {
      'tab-menu': {
        templateUrl: function($stateParams,Menus) {
          console.log("In function") ;
          console.log("Template: " + Menus.get($stateParams.menuID).url) ;
          return 'templates/' + Menus.get($stateParams.menuID).url ;
        },
        controller: 'MenuSubCtrl'
      }
    }
})

// controllers
.controller('MenuCtrl', function($scope,Menus) {
    $scope.menus = Menus.all() ;
}) 

.controller('MenuSubCtrl', function($scope,$stateParams,Menus) {
  $scope.menu = Menus.get($stateParams.menuID);
}) 

// services
.factory('Menus', function() {
  var menus = [
    {name:"Account",url:"menu-account.html",menuID:0},
    {name:"Contact",url:"menu-contact.html",menuID:1},
    {name:"Help",url:"menu-help.html",menuID:2},
    {name:"Privacy",url:"menu-privacy.html",menuID:3},
    {name:"Rate App",url:"menu-rate.html",menuID:4},
    {name:"Report Bugs",url:"menu-bugs.html",menuID:5},
    {name:"Settings",url:"menu-settings.html",menuID:6}
  ] ;

  return {
    all: function() {
      return menus ;
    },
    get: function(menu) {
      for (var i = 0; i < menus.length; i++) {
        if (menus[i].menuID === parseInt(menuID)) {
          return menus[i];
        }
      }
      return null;
    },
  } ;
 }) ;

在上面的.state（＆＃39; tab.menu-detail＆＃39; ...，templuateUrl函数触发并且第一个控制台日志条目有效，第二个没有做任何事情，没有消息，没有错误..它没有。它只是停止。我已经尝试了多次迭代来使这个工作完全失败。当我点击上面的标签页链接（它应该带你到一个子自定义视图）它什么也没做。没有控制台消息，没有错误......没有。

Answer 1

您可以为模板Url分配功能。在解决方案工作正常后，我遇到了类似的情况。检查一下： link

如何在离子选项卡中动态设置templateUrl？

1 个答案: