无法更改 ng-href onClick 事件
Unable to change ng-href onClick event
我的 angular
应用程序中有一个带有 button
的页脚。该按钮具有 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"
})
...
编辑:
现在 url
没有完全改变。这意味着它没有 questionIndex
。它看起来像这样:
http://localhost/myApp/#/quiz/
使用"#/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>
我的 angular
应用程序中有一个带有 button
的页脚。该按钮具有 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"
})
...
编辑:
现在 url
没有完全改变。这意味着它没有 questionIndex
。它看起来像这样:
http://localhost/myApp/#/quiz/
使用"#/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>