-1

我有一個Ionic應用程序，我希望能夠指定當用戶單擊ui-sref單擊時如何進行轉換。目前，如果我點擊按鈕Scientific Facts，幻燈片切換到下一個視圖從右到左。我會喜歡它能夠從左到右。有什麼辦法可以用Ionic來做到這一點？單擊指定動畫轉換

我的主頁。

<view title="'Home'"> 
    <content has-header="true" padding="true"> 
     <p>Example of Ionic tabs. Navigate to each tab, and 
     navigate to child views of each tab and notice how 
     each tab has its own navigation history.</p> 
     <p> 
     <!-- Link is here --> 
     <a class="button icon icon-right ion-chevron-right" href="#/tab/facts">Scientific Facts</a> 
     </p> 

     <button class="button" ng-click="modal.show()">Open Modal</button> 
    </content> 
    </view>

的事實頁面

<view title="'Facts'"> 
    <content has-header="true" padding="true"> 
     <p>Banging your head against a wall uses 150 calories an hour.</p> 
     <p>Dogs have four toes on their hind feet, and five on their front feet.</p> 
     <p>The ant can lift 50 times its own weight, can pull 30 times its own weight and always falls over on its right side when intoxicated.</p> 
     <p>A cockroach will live nine days without it's head, before it starves to death.</p> 
     <p>Polar bears are left handed.</p> 
     <p> 
     <a class="button icon ion-home" href="#/tab/home"> Home</a> 
     <a class="button icon icon-right ion-chevron-right" href="#/tab/facts2">More Facts</a> 
     </p> 
    </content> 
    </view>

的路由節就在這裏。

.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 

    .state('tabs', { 
    url: "/tab", 
    abstract: true, 
    templateUrl: "tabs.html" 
    }) 
    .state('tabs.home', { 
    url: "/home", 
    views: { 
     'home-tab': { 
     templateUrl: "home.html", 
     controller: 'HomeTabCtrl' 
     } 
    } 
    }) 
    .state('tabs.facts', { 
    url: "/facts", 
    views: { 
     'home-tab': { 
     templateUrl: "facts.html" 
     } 
    } 
    }) 
})

我有一個codepen示例here。

來源

2015-06-28 jason328

請解釋我爲什麼被低估。不要簡單地downvote。這根本不能幫助我。 – jason328

將nav-direction =「...」添加到您的鏈接。它接受：前進，後退，退出，輸入，交換。 http://ionicframework.com/docs/api/directive/navDirection/ – jme11

發佈爲答案，我會給你信用。 – jason328

navDirection指令允許您設置特定鏈接的導航方向。用法：

<a class="button icon icon-left ion-chevron-left" href="#/tab/facts" nav-direction="back">Scientific Facts</a>

請確保您使用的是Ionic版本1.0+。

Plunkr

來源

2015-06-28 21:55:46 jme11

單擊指定動畫轉換

回答

Plunkr

相關問題