2017-07-20 76 views
0

我想每次進入另一個頁面時進行加載頁面,所以我想使用animsition,但它不加載視圖 當我看到的網址,在首先它已經更改爲localhost/home - > localhost/product,但突然它會重新加載並回到家中。Animsition與角度UI路由器不能很好地工作

代碼

myApp.directive('animsition', function($location,$timeout){ 
$(".animsition").animsition({ 
    inClass: 'fade-in', 
    outClass: 'fade-out', 
    inDuration: 10, 
    outDuration: 10, 
    // linkElement: '.animsition-link', 
    linkElement: 'a:not([target="_blank"]):not([href^="#"]):not([class*="lg-trigger"]):not([socialshare])', 
    loading: true, 
    loadingParentElement: 'body', 
    loadingClass: 'animsition-loading', 
    loadingInner: '<img src="images/loading.gif" />', // e.g '<img src="assets/img/loading.svg" />' 
    timeout: false, 
    timeoutCountdown: 4000, 
    onLoadEvent: true, 
    browser: ['animation-duration', '-webkit-animation-duration', '-o-animation-duration'], 

    overlay : false, 
    overlayClass : 'animsition-overlay-slide', 
    overlayParentElement : 'body', 
    transition: function(url){ 
      window.location.href = url; 
    } 
}); 

ui.router

.state('home',{ 
    url:'/home', 
    params:{opacity:null,headnav_status:null,no_login:null}, 
    templateUrl:'home.html', 
    controller:'HomeCtrl' 
    }) 

    .state('product',{ 
    url:'/product', 
    params:{product_id:null}, 
    templateUrl:'product.html', 
    controller:'ProductCtrl' 
    }) 

點擊功能

$scope.gotoProduct = function(product_id) { 
    $state.go('product', { product_id: product_id}); 
} 

    <a ng-click="gotoProduct(id)">Product </a> 

任何人有任何想法,爲什麼?

謝謝

+0

您的路由器代碼沒有定義「product_detail」作爲州。你錯過了嗎,還是實際上沒有在你的代碼中? –

+0

我想念那個,謝謝隊友! – beginnerprogrammer

回答

1

找到了!

我這段代碼添加到animsition指令

transition: function(url){ 
    if(url){ 
     window.location.href = url; 
    } 
    else{ 
     location.reload(); 
    } 
} 

而且它正常工作, 希望它能幫助任何人誰需要animsition在它們的角應用〜