On a keyboard event I want to change the ng-include directive's src value dynamically.
Add a comment
|
1 Answer
Here is a code example that could help you:
<div class="example-animate-container" ng-include="{{template.url}}">
Then in directive or controller
$(document).on("keydown", function () {
template.url = "put the value here";
$scope.$apply();
});
answered Jun 13, 2013 at 17:15
Ajay Singh Beniwal
19k11 gold badges84 silver badges100 bronze badges
7 Comments
Dan Kanze
You seem like you might be able to answer a simliar question of mine here: stackoverflow.com/questions/17091713/dynamic-routing-angularjs
Ajay Singh Beniwal
i have interpolated angular value in ng-include so when template.url will change ng-include will fetch the new url and on key press im changing template.url value which will update the source of ng-include automatically please give it a try and let me know if it solves your problem
D.S
I made it working by intercepting the keydown event in external jQuery keydown function, however as you said "Then in directive or controller", how can I do that? I mean, say I have a $scope.url variable in my controller, I want to write a keydown listener inside my same controller which will reset the $scope.url value on some keydown event.
Ajay Singh Beniwal
if you go by angular standard you should avoid dom manipulation inside controller but still if you want to update dom inside controller then you can just use the keydown event inside the controller
D.S
I want to go by Angular way, so I won't put the dom manipulation inside controller. So where do I put it? in external jQuery script(like what I am doing now)? or in directive def? If directive def, then code example please. Thanks very much.
|