AngularJS HREF не получает значение динамического

Question

Javascript код:

cable.register.controller('VideoMonitorCtrl', ['$scope', '$sce','ENV', '$http', function ($scope, $sce, ENV, $http) { 
     console.log('Begin in video monitor controller'); 

     var keepGoing =true; 
     var url = '/ps/features/'; 
     var exists = false; 
     $scope.getVideoService = function() { 
     console.log("url"+$scope.hurl) 
     $http.get(url,{headers: {'contentType': 'application/json; charset=UTF-8'}}).success(function(response) { 
     if(response!='') 
     { 
      angular.forEach(response.features, function(feature){ 
       console.log("in for each"); 
       console.log(counter++) 
      if(keepGoing) 
      {  
       if(feature.name.trim() === "odl-video-monitor" && feature.installed.trim() ==='x') 
       { 
        console.log('in active again'); 
        $scope.color='#FFFFFF'; 
        $scope.msg='Quality Network'; 
        $scope.hurl='index.html#/cable/videomonitor'; 
        exists=true; 
        keepGoing = false; 
       } 

      } 
      }); 
      if(!exists) 
      { 
       $scope.color='#BDBDBD'; 
       $scope.msg='Video Quality Network is under maintenance'; 
      } 
     } 
     else 
     { 
      $scope.color='#BDBDBD'; 
      $scope.msg='Video Quality Network is under maintenance'; 
     } 
     }).error(function (response) { 
       $scope.color='#BDBDBD'; 
       $scope.msg='Video Quality Network is under maintenance';  
      }); 
     }; 

    } 
    ]); 

HTML код:

<a ng-href='{{hurl}}' ng-controller="VideoMonitorCtrl" ng-init="getVideoService()" id="hlink" style="text-decoration:none;">  
     <div class="box" style="background-color:{{color}};"> 
     <div style="margin-top:15px;text-align:left;padding-left:23px;"> 
      <span style="font-size:24px !important;font-family:Times New Roman, serif;color:#7B7B7B;" class="Large">{{msg}} 
      {{hurl}} 
      </span> 
     </div> 
     </div> 
     </a> 

Выход:

{{hurl}} => печатает значение в DIV ,

<a href={{hurl}} => здесь нет значения, и ссылка не включена.

Любая причина? я могу видеть содержимое hurl в div, но не в href?

Если я пишу hardcoded значение в href, он работает, но не динамический?

Answer 1

Оберните весь элемент <a> в другом элементе и установите контроллер там, область действия вашего VideoMonitorCtrl не распространяется на сам тег <a>.

<div ng-controller="VideoMonitorCtrl" ng-init="getVideoService()"> 
    <a ng-href='{{hurl}}' id="hlink" style="text-decoration:none;">  
     <div class="box" style="background-color:{{color}};"> 
     <div style="margin-top:15px;text-align:left;padding-left:23px;"> 
      <span style="font-size:24px !important;font-family:Times New Roman, serif;color:#7B7B7B;" class="Large">{{msg}} 
      {{hurl}} 
      </span> 
     </div> 
     </div> 
    </a> 
</div>