2015-10-09 36 views
-1

我在使用离子(1.6.5)和角度js和iOS和Android构建科尔多瓦(5.3.3)中创建的应用程序出现问题。科尔多瓦离子应用程序似乎加载控制器两次

我有一个菜单项,当我点击应加载其他菜单项的下一个状态。然而,它似乎是在没有动画的情况下加载下一个状态,然后再加载状态,导致动画产生“干扰”效果。我最近在这里上传的视频中显示:https://www.youtube.com/watch?v=YCEQeqFyNl4&feature=youtu.be

我想知道是否有人对这里有什么问题以及我应该开始寻找问题有所了解,或者是否有已知的错误?

任何帮助,将不胜感激!

// the controller 
 
.controller('ProgramCtrl', ['$scope', 'FacProgram', 
 
    function($scope, FacProgram) { 
 

 

 
    $scope.refresh = function() { 
 
     FacProgram.refresh() 
 
     .finally(function() { 
 
      $scope.$broadcast('scroll.refreshComplete'); 
 
     }); 
 
    }; 
 

 
    $scope.temp_articles = function() { 
 
     return FacProgram.all(); 
 
    }; 
 

 
    } 
 
]) 
 

 
.controller('ProgramDetailCtrl', ['$scope', '$stateParams', 'FacProgram', 
 
    function($scope, $stateParams, FacProgram) { 
 
    $scope.art = FacProgram.get($stateParams.programId); 
 

 
    } 
 
]) 
 

 

 
// The factory in a different js file: 
 

 
.factory('FacProgram', ['$http', '$q', 'FacJson', 
 
function($http, $q, FacJson) { 
 

 
    var temp_articles = []; 
 

 

 
    function findHeader(src, headTag, index) { 
 
    var head = $(src).find(headTag).get(0); 
 
    temp_articles[index].headlinethumb = head.textContent; 
 
    temp_articles[index].headline = head.textContent; 
 
    } 
 

 

 
    function refresh() { 
 
    var q = $q.defer(); 
 

 
    ... // A fucntion that get's URL's from .json file 
 
    //////////////////////////////////////////////////////////// 
 
    angular.forEach(urls, function(URL, index) { 
 
     //add the articles to the dictionary 
 
     temp_articles.push({ 
 
     inx: index, 
 
     img: img_logos[index] 
 
     }); 
 
     $http.get(URL) 
 
     .then(function(sc) { 
 
      // The will parse the html looking for thumbnail text, main body text etc 
 
      var src = sc.data.substring(sc.data.indexOf('<html>')); 
 

 
      ... // code that parses website for content etc 
 
      //////////////////////////////////////////////////////// 
 
      q.resolve(); 
 
      }, 
 
      function() { 
 
      q.reject(); 
 
      }); 
 
    }); 
 
    }); 
 

 
return q.promise 
 
} 
 

 

 
return { 
 
all: function() { 
 
    return temp_articles; 
 
}, 
 
get: function(programId) { 
 
    return temp_articles[programId]; 
 
}, 
 
refresh: function() { 
 
    console.log('DPG programs refresh triggered'); 
 
    temp_articles = []; // a catch to prevent duplicates and to allow other templates to use without 
 
    //contamination 
 
    return refresh() 
 
} 
 
} 
 
}]);
<!-- the start state for progams of the DPG --> 
 
<ion-view> 
 
    <ion-content> 
 
    <div class="list"> 
 
     <a class="item item-thumbnail-left item-icon-right item-text-wrap" ng-repeat="art in temp_articles()" href="#/program/{{$index}}"> 
 
     <img ng-src="{{art.img}}"> 
 

 
     <h2 class="padding-top" style="font-weight: 300;">{{art.headlinethumb}}</h2> 
 
     <i class="icon ion-chevron-right" style="font-size: 18px"></i> 
 
     </a> 
 
    </div> 
 

 
    </ion-content> 
 
</ion-view> 
 

 

 

 
<!-- the datailed view of the application --> 
 
<ion-view> 
 
    <ion-content> 
 

 

 

 
    <div style="text-align: left; padding-top: 30px; padding-left: 20px; padding-right: 20px"> 
 
     <h2 style="font-weight: 500; font-size: 17px">{{art.headline}}</h2> 
 
    </div> 
 
    <!--<p style="padding-left: 10px; font-size: 13px; font-weight: 300">Datum</p>--> 
 

 
    <div style="text-align: center"> 
 
     <img style="max-height: 300px; max-width: 300px; width: auto;" ng-src="{{art.img}}"> 
 

 
    </div> 
 
    <div class="padding" style="font-weight: 300"> 
 
     <div ng-bind-html="art.text | hrefToJS"></div> 
 
    </div> 
 

 
    </ion-content> 
 
</ion-view>

+0

我已经看到了这个链接BTW:http://stackoverflow.com/questions/30569122/controller-being-called-twice-in但是对我来说,它看起来不像我的问题的解决方案 –

回答

0

同样发生在我身上,如果你把你在app.js控制器尝试从那里取出并且仅将它的控制器或反之亦然。

您在app.js状态应该是这样的:

.state('state-name', { 
    url: '/state-name', 
    templateUrl: "templates/walkthrough/state-name.html" 
    //Notice no controller here 
    }) 
相关问题