我可以隔离 div 的范围吗？

Question

我的示波器上有一个页面和一个模型$scope.model = { ... }; 我将页面上的值与模型上的值绑定，这很好。我在该模型的某个地方嵌套了一个地址，为了这个例子，让我们说

$scope.model = {访问：[{日期：...，地址：[{...}，...]}， ...], ...};

我需要将第一次访问的所有信息都写在 div 的某个地方。我知道我可以输入像model.visits[0].addresses[0].Zip 等这样的所有字段，但是model.visits[0].addresses[0] 中有 5 个字段我需要输出。我想，有最简单的方法吗？我考虑放一个

<div ng-init="a = model.visits[0].addresses[0]">{{a.Zip}}...</div>

然后像这样访问所有属性。我真正想要的是，除非我可以将 a 的范围缩小到一个 div，否则不要在名为 a 的范围内创建新属性。

这可能吗？

澄清：我知道我可能可以重做我的模型或将数据上移到模型本身，但这只是我多次遇到的问题，我真的很想知道是否有解决问题的方法像这样。

Answer 1

你可以创建一个小指令，在你想要的元素上创建一个新的范围：

...
angular.module('yourApp').directive('newScope', function () {
    return {scope: true};
});

那么你可以这样使用它：

<div ng-init="tmp=model.visits[0].addresses[0]" new-scope>{{tmp.Zip}}...</div>

现在，tmp 属性将附加到由 newScope 指令创建的新作用域，并且不会影响父作用域。

另请参阅此short demo。