Reputation: 343
I want to replace text in html with a value from a controller The original text string is image.name, which is the image title Via a click event from the 'GoToImage' controller, the span should replace the image.name with newName Now, it only adds the newName, but doesn't replace the image.name
Markup:
<div data-ng-controller="GoToImage">
<span data-ng-model="newName">
{{image.name}}
{{newName}}
</span>
</div>
the controller:
.controller('GoToImage', function ($scope) {
$scope.newName = {};
$scope.newDescription = {};
$scope.selectedIndex = 0;
$scope.setImage = function(index) {
$scope.selectedIndex = index;
$scope.newName = $scope.series.images[index].name;
$scope.newDescription = $scope.series.images[index].description;
}
});
also, I cannot get rid of the {} signs which show by default before the click event is fired
Upvotes: 0
Views: 757
Reputation: 31761
You could try creating a new property that returns the current value that should be used.
$scope.nameDisplay = image.name
Then later in your code you can update the nameDisplay
property to the value of newName
and your UI can just bind to {{nameDisplay}}
.
Upvotes: 1