Question

我想在指令中访问此案例映射中的变量，而不必像将其设置为directrive map =“someValue”的attr那样预定义它。而且我也不想使用范围。$ apply因为我实际上只希望变量在指令的隔离范围内。这甚至可能吗？这里的最佳做法是什么？基本上我的指令需要同时做到。访问父作用域并拥有自己的作用域，我可以用它构建模板。

谢谢大家。

这是我的Js代码：

.directive('myFilter', function() {
    return {
        restrict: 'E',
        scope: {
            source: '=source',
            key: '=key',
        },
        link: function(scope, element, attrs) {
            scope.$on('dataLoaded', function(e) { 
                scope.map = {};
                angular.forEach(scope.source, function(paramObj) {
                    if (!scope.map[paramObj[scope.key]]) {
                        var newEntry = {
                            value: paramObj[scope.key],
                            isChecked: false
                        }
                        scope.map[paramObj[scope.key]] = newEntry;
                    }
                });
            }); 
        }   
    }
});

和我的HTML：

<my-filter source="metaPara.filteredParameters" key="'value'">
    <table class="table table-borered">
       <tr data-ng-repeat="item in map">
          <td>{{item.value}}</td>
        </tr>
    </table>
</my-filter>

Answer 1

您可能希望再次参考Angular文档中的指令。

如果您需要隔离范围（ 无法访问祖先 的范围），请使用

scope : { /* ... */ }

否则，如果您想要一个可以访问祖先的唯一范围，请使用

scope : true

然后，您可以将您的HTML修改或事件监听（不依赖于ng-click或Angular已经涵盖的其他内容）放在

中

link : function (scope, el, attrs, controller) { }

...您可以将所有常规实现放在

中

controller   : ["$scope", function ($scope) {
    var myController = this;
    myController.property = "12";
}],
controllerAs : "myController"

因此，您可以在模板中说：

<span>{{ myController.property }}</span>

您还可以使用预先注册的控制器，您可以按名称呼叫：

controller   : "mySimpleController",
controllerAs : "myController"

此外，我建议使用$scope.$apply（必须注入），而不是使用$timeout。

区别在于$scope.$apply只能在某些点上运行 - 如果你已经在摘要周期内，它会抛出一个错误，而不是更新任何东西。
$timeout( )将更新设置为 next 更新周期。

理想情况下，您应该知道是否需要$apply，并且能够保证您每次更新/摘要仅在一个地方使用它，但$timeout将从那些你不一定确定的地方救你。

Angular JS：如何在模板中使用的指令局部作用域上设置属性？

1 个答案: