xxx12123
xxx12123

Reputation: 343

replace text in html with value from controller with angularjs

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

Answers (1)

Andy Gaskell
Andy Gaskell

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

Related Questions