2016-08-12 11 views
5

ui-tabではui-viewが機能しません。シナリオを見て、私が間違っている場所に親切に教えてください。ui-viewは、angle-ui-tabの対応するテンプレートをレンダリングしていませんか?

は顧客のページでは、私は任意の顧客customers.view.htmlをクリックすることで、ページ更新の顧客を呼び出しています、このページには、顧客のリストが含まれています。顧客をクリックすると、次のようなリンクが開きます。コンフィグで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> 

、私はURL 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

あなたはその後、タブが動作するはずhome.updatecustomerに自分の状態を変更することができます場合はui-sref

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

に括弧なしcustomer.idがあるはずです。

更新

固定属性:

  • 渡さui-srefaにタグ
  • aタグに渡さpull-rightクラス
1
<a><i ui-sref="home.updatecustomer({ customerId: customer.id })" class="fa fa-edit pull-right" ng-click="$event.stopPropagation()"></i></a> 

これもatnと同じように試してみましょう。私は同じ考えを持っていると思っています。

関連する問題