2014-10-03 40 views
0

我在我的網站上創建了一個小的Angular模塊(在poge load上)從數據庫調用一個俱樂部列表,並通過視圖顯示它們。 我有問題,而控制器沒有自行更新。控制器變量顯示正確的數據,但不更新視圖。 這裏是我的代碼:角度控制器沒有更新我的視圖

查看文件:

<div ng-app="clubFilter" ng-cloak class="col-lg-12" ng-controller="clubController"> 
{{clubObj.clubs}} 
<div class="col-lg-3" id="clubs-filter-left"> 
    <form ng-submit="filterClubs()"> 
     <input type="text" name="location" ng-model="searchTerm" placeholder="Search..." /> 
     <input type="submit" name="submit" value="Submit" /> 
    </form> 
    <div id="searchInfo" ng-show="(searchTerm != '') || (activityText != '')"> 
     <span ng-show="searchTerm != ''"><strong>Location:</strong> {{searchTerm}}</span> 
     <span ng-show="activityText != ''"><strong>Activity:</strong> {{activityText}}</span> 
     <span class=''>(Distance indicated in miles)</span> 
    </div> 
    <div id="activityInfo" ng-show="activityText != ''"> 
     <p>Your nearest Leisure Centres with {{activityText}} facilties</p> 
    </div> 
</div> 
<div class="col-lg-9" >  
    <ul class="leisure-centres">    
     <li ng-repeat="club in clubs" ng-show="club.show">    
      <div class="centre"> 
       <a class="link" ng-href="http://isca01.bigwavemedia.info{{club.link}}">More info</a> 
       <a class="link" ng-show="club.distance > 0" ng-href="{club.link}" ng-cloak>{{club.distance}}m</a>   
       <div class="image" ng-show="club.image > 0"> 
        <img src="{{image}}" alt="{{club.title}}" />       
       </div> 
       <div class="details"> 
        <div class="title"> 
         <h3>{{club.title}}</h3> 
        </div> 
        <div class="address"> 
         {{club.building}}, 
         {{club.street}}, 
         {{club.city}}, 
         {{club.county}}, 
         {{club.postcode}}       
        </div> 
        <div class="tel"> 
         <strong>Tel: </strong> 
         <a href="tel:{{club.telephone}}" ng-bind="club.telephone"></a> 
        </div> 
        <div class="email"> 
         <strong>Email: </strong> 
         <a href="mailto:{{club.email}}" ng-bind="club.email"></a> 
        </div> 
       </div> 
      </div> 
     </li>   
    </ul> 
</div> 

控制器:

angular.module('clubFilter.controllers', []). 
controller('clubController', function($scope, $http, googleMapService, clubService) { 

    if(searchTerm == "" && activity == "") {   
     clubService.getClubs().then(function(clubs) { 
      $scope.clubs = clubs; 
      console.log($scope.clubs); 
     });  
    } else if (searchTerm != "" && activity == "") { 

    } else if (searchTerm == "" && activity == "") { 

    } else if (searchTerm != "" && activity != "") { 

    } 

這裏是的console.log的結果(你可以看到有結果並且它們是正確的)

Object { id="1", a_id="["2","6","11","13","14",...8","69","76","84","97"]", title="Ashington Leisure Centre", more...}, Object { id="2", a_id="null", title="Beach Huts", more...}, Object { id="3", a_id="["2","6","11","13","14",...","70","76","84","105"]", title="Blyth Sports Centre", 

任何人都可以看到爲什麼$ scope.clubs變量在我的視圖中沒有讓自己陷入ng-repeat? 感謝

回答

1

我沒有看到show在你的俱樂部對象&hellip的任何地方;因此ng-show="club.show"是假的,並防止視圖從NG重複顯示你的俱樂部。

相反的:

<li ng-repeat="club in clubs" ng-show="club.show"> 

試試這個:

<li ng-repeat="club in clubs"> 
+0

噢,我的字多麼愚蠢的我。謝謝 – devoncrazylegs 2014-10-03 13:19:10

相關問題