2

次のような .state タブ定義に templateUrl パラメータを渡すことは可能ですか? 複数の異なるページを作成する必要があり、単一のテンプレート内にネストされた多数の ng-if を使用して、どの「html」ページを表示するかを解析したくありません。

  .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('tab.menu-detail'..., templuateUrl 関数が起動し、最初のコンソール ログ エントリが機能し、2 番目のログ エントリは何もせず、メッセージもエラーもありません...何もしません。これを機能させるために何度も繰り返してみましたが、完全に途方に暮れています. 上記のタブページリンク (サブカスタムビューに移動するはずです) をクリックしても何も起こりません. コンソールメッセージもエラーもありません.. 。なし。

4

1 に答える 1