ng-repeat并选择框过滤

时间:2013-06-14 14:18:18

标签: angularjs angular-ui angularjs-ng-repeat ng-repeat

我有一篇文章列表和类别。我只需要根据所选类别更新文章列表。

我可以用所有文章填充列表,我没有问题。但我无法填充类别选择框,我无法将函数绑定到更改事件的类别列表。

以下是代码:

<script>
function contrArticles($scope, $http) {
    $scope.articles = [];
    $scope.categories = [];
    $http({ method: 'GET', url: 'dbOps.aspx?act=articleList' }).
        success(function (data, status, headers, config) {
            $scope.articles = data.Table;
        }).
        error(function (data, status, headers, config) {
            console.log('http error');
        }
    );

    $http({ method: 'GET', url: 'dbOps.aspx?act=categoryList' }).
        success(function (data, status, headers, config) {
            $scope.categories = data.Table;
        }).
        error(function (data, status, headers, config) {
            console.log('http error');
        }
    );

    $scope.selectCategory = function () {
        $http({ method: 'GET', url: 'dbOps.aspx?act=categoryList&catID=' + $scope.category}).
            success(function (data, status, headers, config) {
                $scope.categories= data.Table;
            }).
            error(function (data, status, headers, config) {
                console.log('http error');
            }
        );
    }
}
</script>

  <div ng-controller="contrArticles">
    <ul class="article_list">
      <li ng-repeat="article in articles | filter:search">
        <a href="#" title="article title here">
          <span class="date">
            <span class="month">{{ article.dt_month }}</span>
            <span class="day">{{ article.dt_day }}</span>
            <span class="year">{{ article.dt_year }}</span>
          </span>
          <img ng-src="images/news/{{ article.id }}.jpg" alt="{{ article.title }}" class="thumb" />
          <div class="summary">
            <span class="article_title">{{ article.title }}</span>
            <span class="short">{{ article.content }}...</span>
          </div>
        </a>
      </li>
      <li ng-show="(articles | filter:search).length==0">No article found</li>
    </ul>
  </div>

    <select class="combobox" ng-change="selectCategory ()" ng-model="category">
      <option value="">Show all</option>
      <option ng:repeat="s in sports" value="{{ s.id }}">{{ s.tag }}</option>
    </select>

感谢。

1 个答案:

答案 0 :(得分:0)

$scope.selectCategory中存在语法错误。这样:

'dbOps.aspx?act=categoryList&catID='$scope.category}).

应该是:

'dbOps.aspx?act=categoryList&catID=' + $scope.category}).
相关问题