角度控制器變量不顯示

Question

我已經在我的一個網站中構建了一個小的Angular組件，這是我遇到的一些問題。 我爲我的應用程序定義了一個控制器，但視圖並未從控制器中拉出任何變量或函數，我不知道爲什麼。 這是我的代碼：

這是我的文件來定義控制器：

angular.module('clubFilter.controllers', []). 
controller('clubController', function($scope, $http, googleMapService) { 
    $scope.clubsJSON = JSONItems; 
    $scope.clubs = $scope.clubsJSON; 
    if(searchTerm == "" && activity == "") {    
     $scope.clubs = $scope.clubsJSON;  
     console.log($scope.clubs); 
    } else if (searchTerm != "" && activity == "") { 

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

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

    } 
    ........ 

這是我的角度的應用程序的文件：

var clubFilter = angular.module("clubFilter", [ 
'clubFilter.controllers', 
'clubFilter.services' 

]）;

這裏是我的HTML視圖：

<div ng-app="clubFilter" ng-cloak class="col-lg-12" ng-controller="clubController"> 
<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> 

頁面加載時，將$ scope.clubs對象應該通過被環，然後顯示在視圖中的NG-重複。這似乎並沒有發生雖然，任何人都可以看到爲什麼這不起作用？我檢查了對象的結構，它很好，並且一直在工作。 感謝

編輯補充的JSONitems對象結構：

[ 
Object { 
    id="1", 
    title="Ashington Leisure Centre", 
    description="<p>Ashington Leisure Cen...ase give us a call.</p>", more...}, 
Object { 
    id="2", 
    title="Beach Huts", 
    description="<p>A trip to the beautif...ings - 01670 542222</p>", more...}, 
Object { 
    ........ 

Answer 1

//app 
 
angular.module('clubFilter', ['clubFilterControllers']) 
 

 
//controller 
 
clubFilterControllers.controller('viewController', ['$scope', '$http', 'googleMapService', 
 
    function($scope, $http, googleMapService){ 
 
    /* logic here */ 
 
}])

嘗試t o定義這樣的控制器。

Answer 2

你別名您的控制器，但沒有使用別名來訪問數據

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