在AngularJS

Question

我在我的HTML有下拉與選擇的項目替換文本：

<div class="dropdown"> 
     <button class="dropdown-toggle" type="button" data-toggle="dropdown" ng-model="yearName">Sort by year 
      <span class="caret"></span></button> 
      <ul class="dropdown-menu"> 
      <li ng-repeat="year in ctrl.getYear() | orderBy: videoYear"> 
       <input type="checkbox" ng-model="ctrl.filter[year]" id='year{{$index}}' class='chk-btn styled-checkbox' /> 
       <label for='year{{$index}}'>{{year}}</label> 

      </li> 
      </ul> 
     </div> 

標題是「按年份排序」，但現在我想改變一個項目時，其按標題獲取。所以，如果我選擇1984年，標題應該是1984年。我該怎麼做？

謝謝。

Answer 1

請檢查代碼

angular.module("sampleApp", []) 
 
    .controller('sampleCtrl', function($scope) { 
 
    var ctrl = this; 
 
    ctrl.filter = {}; 
 
    ctrl.getYear = function() { 
 
     return [2001, 2002, 2003] 
 
    } 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="sampleApp" ng-controller="sampleCtrl as ctrl"> 
 
    <div class="dropdown"> 
 
    <button class="dropdown-toggle" type="button" data-toggle="dropdown" ng-model="yearName">Sort by year 
 
     <span class="caret"></span></button> 
 
    <ul class="dropdown-menu"> 
 
     <li ng-repeat="year in ctrl.getYear() | orderBy: videoYear"> 
 
     <input type="checkbox" ng-model="ctrl.filter[year]" id='year{{year}}' ng-true-value="{{year}}" class='chk-btn styled-checkbox' /> 
 

 
     <label for='year{{year}}'>{{year}}</label> 
 

 
     </li> 
 
    </ul> 
 
    {{ctrl.filter}} 
 
    </div>