2016-08-12 52 views
5

ui-view不適用於ui-tab。請看情景,並請告訴我我的錯在哪裏。ui-view沒有爲angular-ui-tab渲染相應的模板?

在客戶頁面中,我打電話給頁面更新客戶,點擊任何客戶customers.view.html,此頁面包含客戶列表。當我點擊任何客戶時,它會打開如下URL的鏈接。 http://localhost:3000/home/#/updatecustomer/5

customers.view.html

<a><i ui-sref="home.updatecustomer({ customerId: {{customer.id}} })" class="fa fa-edit pull-right" ng-click="$event.stopPropagation()"></i></a> 

在配置,我創建了網址http://localhost:3000/home/#/updatecustomer/5,我能打開網頁的index.html,但相應的配置文件和設置視圖是不開放。 ..

請參閱類似的工作演示Working DEMO

配置

.state('home.updatecustomer', { 
    url: 'updatecustomer/:customerId', 
    views:{ 
       '':{ 
        templateUrl: 'addcustomer/index.html', 
        controller: 'TabsDemoCtrl', 
       }, 
       'profile':{ 
        templateUrl: 'addcustomer/profile.html' 
       }, 
       'setting':{ 
        templateUrl: 'addcustomer/setting.html' 
       }, 
      } 
    }) 

控制器

var app = angular.module('app') ; 
    app.controller('TabsDemoCtrl', TabsDemoCtrl); 
    TabsDemoCtrl.$inject = ['$scope', '$state']; 
    function TabsDemoCtrl($scope, $state){ 
     $scope.tabs = [ 
      { title:'profile', view:'profile', active:true }, 
      { title:'setting', view:'setting', active:false } 
     ]; 
    } 

的index.html

<uib-tabset active="active"> 
    <uib-tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disable="tab.disabled"> 
     <div ui-view="{{tab.view}}"></div> 
    </uib-tab> 
</uib-tabset> 

profile.html

<div>profile of customer </div> 

Setting.html

<div>Setting for customer </div> 
+0

從ui-view中刪除括號,它不需要。我不知道這是否是問題... –

+0

@GustavoGabriel我刪除,但仍然不工作,我不會有任何問題,因爲在工作演示中,我們使用相同的東西... – Guest

+0

@geeks Can你還請在你的plunkr中添加配置? –

回答

0

應該有customer.id沒有括號中ui-sref

<a ui-sref="home.updatecustomer({ customerId: customer.id })" class="pull-right"><i class="fa fa-edit"></i></a> 

如果你可以將您的狀態更改爲home.updatecustomer那麼標籤應該工作。

更新

固定屬性:

  • 通過ui-srefa標籤
  • 通過pull-righta標籤
1
<a><i ui-sref="home.updatecustomer({ customerId: customer.id })" class="fa fa-edit pull-right" ng-click="$event.stopPropagation()"></i></a> 

試試這個作爲atn也提到我有同樣的想法希望它有幫助