如何解析插值範圍名稱？

Question

我有這樣的代碼：

<div ng-repeat="(key, category) in shop.categories"> 
    <div ng-repeat="(key, group) in category.groups"> 
    <span ng-bind="'groupPrice-' + ($parent.$index + 1) + '-' + ($index + 1)"></span> 
    </div> 
</div> 

我想在例如$scope.groupPrice-1-1的<span>值顯示，$scope.groupPrice-1-2等

如何可以解析我的範圍ng-bind顯示值？現在這個顯示名稱的範圍，而不是值。

Answer 1

嘗試使用angular指令來評估字符串到對象的屬性。

的HTML代碼：

<div ng-app="vkApp"> 
    <div ng-controller="vkController">   
     <span compile="groupPrice_1_1"></span> 
     <br> 
     <span compile="groupPrice_1_2"></span> 
    </div> 
</div> 

角腳本：

angular.module('vkApp', []); 

angular.module('vkApp') 
    .controller('vkController', ['$scope', '$compile', function ($scope, $compile) { 
     $scope.groupPrice_1_1 = "Hi man !"; 
     $scope.groupPrice_1_2 = "lol !"; 
    }]); 

    // declare a new module, and inject the $compileProvider 
angular.module('vkApp') 
    .directive('compile', ['$compile', function ($compile) { 
     return function(scope, element, attrs) { 
      scope.$watch(
      function(scope) { 
       // watch the 'compile' expression for changes 
       return scope.$eval(attrs.compile); 
      }, 
      function(value) { 
       // when the 'compile' expression changes 
       // assign it into the current DOM 
       element.html(value); 

       // compile the new DOM and link it to the current 
       // scope. 
       // NOTE: we only compile .childNodes so that 
       // we don't get into infinite loop compiling ourselves 
       $compile(element.contents())(scope); 
      } 
     ); 
    }; 
}]); 

JSFiddle here

的Cr。 angular ng-bind-html and directive within it

注意：您必須將$scope.groupPrice-1-1更改爲$scope.groupPrice_1_1。

希望這個提示可能會有所幫助。