rUI
rUI

Reputation: 13

How to update the ng-href URl on $scope change

I'm looking to update the 'ng-href' url on scope value from controller.Initially on page load url is inserted fine. But then when i change the scope that URL should be updated

<a ng-href=={{selectedValue}} /a>

//in my controller
$scope.selectedValue = "www.google.com"

//need to update this url in this function
otherButtonFn = function(){
//want to Update the url here
$scope.selectedValue =  "www.yahoo.com"
}

//ng-href is loading initial url but not updating when $scope is called
  <a ng-href=="www.google.com" href=""www.google.com" /a>

Here i want to update the url with "www.yahoo.com" when that function is called.

Upvotes: 0

Views: 1980

Answers (2)

Ankit Solanki
Ankit Solanki

Reputation: 82

The problem is with the anchor tag which has double == and no "" around it. Please see updated example below:

<a ng-href="{{selectedValue}}">Link Name</a>

$scope.selectedValue = "www.google.com";


$scope.otherButtonFn = function(){
   $scope.selectedValue =  "www.yahoo.com";
}

Upvotes: 1

shaunhusain
shaunhusain

Reputation: 19748

angular.module('myApp',[])
.controller('TestCtrl', function($scope){
  $scope.something = "somewhere";
  $scope.changeSomething = function(){
    $scope.something = "somewhere else";
  }
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="TestCtrl">
    <a ng-href="{{something}}">{{something}}</a>
    <button ng-click="changeSomething()">Change</button>
  </div>
</div>

Not able to reproduce the problem as stated.

Upvotes: 0

Related Questions