ng-href onClickイベントを変更できません

Question

buttonのフッターがangularアプリにあります。ボタンにはng-href属性があり、ng-clickイベント中に変更してルーティングメカニズムに影響を与える必要があります。何らかの理由で私はこの仕事をすることができません。究極の目標は、各ボタンを1〜5回押して数字を追加することです。

フッターがcomponentです：

app.component('footerx', { 
    bindings: { 

    }, 
    templateUrl: 'views/footer.html', 
    controller: function() { 
     this.buttonText = "Next"; 
     var self = this; 
     var i = 1; 
     this.changeHref= function() { 
      self.questionIndex=i; 
      i++; 
     } 
    } 
}); 

フッターのHTML：

<footer class="footer"> 
    <div class="container"> 
     <a class="btn btn-primary" ng-click="$ctrl.changeHref()" ng-href="#/quiz/{{questionIndex}}" id="btn">{{$ctrl.buttonText}}</a> 
    </div> 
</footer> 

ルーティングJS一部：

... 
     .when("/quiz/:index", { 
      templateUrl: "views/questionPage.html", 
      controller: "questionController" 
     }) 
... 

EDIT： 今urlが完全に変更されません。つまり、questionIndexはありません。それは次のようになります。あなたがデバッグするあなたの試みで、より詳細には触れてくださいすることができ

http://localhost/myApp/#/quiz/ 

Answer 1

使用"#/quiz/{{$ctrl.questionIndex}}

<footer class="footer"> 
    <div class="container"> 
     <!-- REMOVE 
     <a class="btn btn-primary" ng-click="$ctrl.changeHref()" 
        ng-href="#/quiz/{{questionIndex}}" id="btn"> 
      {{$ctrl.buttonText}} 
     </a> 
     --> 
     <!--ADD --> 
     <a class="btn btn-primary" ng-click="$ctrl.changeHref()" 
        ng-href="#/quiz/{{$ctrl.questionIndex}}" id="btn"> 
      {{$ctrl.buttonText}} 
     </a> 
    </div> 
</footer>