AngularJS - 在正确的范围内评估指令的选项

这里是有角度的新手。试图让我的头脑集中在指令、范围、嵌入等等方面。

这就是我想要实现的目标——单元格中的每个表格都需要根据单元格内的值进行颜色编码（更改 bgcolor 或添加特定的 CSS 类）。复杂的是，该单元格不具有裸值 - 它还有其他位和小玩意。因此，在单元格内，我希望能够添加自定义 HTML。

我的模板如下所示：

<span color-codify="{'max' : object.max, 'value' : object.value}" ng-transclude>
  {{ object.value }}
  <a href="#">Edit</a> | <a href="#">Delete</a>
</span>

我的指令如下所示：

myModule.directive('colorCodify', function() {
  return {
    restrict: 'A',
    transclude: 'true',
    'link' : function(scope, element, attrs, controller) {
      var opts = scope.$eval(attrs.colorCodify);
      console.log(opts); // THIS DISPLAYs {max: undefined, value: undefined} 
    }
  }
});

令人惊讶的是，尽管{{ object.value }}内<span>元素渲染正确，但它没有正确传递给指令。但是，如果我指的是$parent它工作正常。例子：

<span color-codify="{'max' : $parent.object.max, 'value' : $parent.object.value}" ng-transclude></span>

这是怎么回事？

<span color-codify="{'max' : object.max, 'value' : object.value}" ng-transclude>
  {{ object.value }}
  <a href="#">Edit</a> | <a href="#">Delete</a>
</span>

.

myModule.directive('colorCodify', function() {
  return {
    restrict: 'A',
    transclude: 'true',
    scope: {getOpts: "&colorCodify"},
    'link' : function(scope, element, attrs, controller) {
      var opts = scope.getOpts();
      console.log(opts);
    }
  }
});

有关更多信息，请查看指令定义对象部分http://docs.angularjs.org/guide/directive http://docs.angularjs.org/guide/directive

编辑$parent：

我想您需要更多地了解范围如何在角度中工作（它们如何相互继承以及它们如何覆盖这些继承的属性）。这将是 Angularjs 中最重要的方面之一。我建议您点击链接并一遍又一遍地阅读它们，直到您明白为止。

ngScope 文档参考 http://docs.angularjs.org/api/ng.%24rootScope.Scope
开发者指南 http://docs.angularjs.org/api/ng.%24rootScope.Scope
奖励（来自 AngularJS 团队的视频，讨论 AngularJS 的最佳实践）：
Youtube http://www.youtube.com/watch?v=ZhfUv0spHCY