Javascript angular ui router存在问题-我无法对指令中的重复应用筛选器

我有一个问题，只有当我加载指令作为角度ui路由器状态的一部分时才会发生。当我将指令直接添加到index.html时，一切都按预期工作

下面是一个plunker，它说明了我遇到的问题：

我有一个资源

personResource

，它返回一个对象数组。
控制器

personController

查询资源，并将结果保存到

$scope.people

这将填充一个模板

list people.html

，该模板加载在指令

listppeople

中

我遇到的问题是另一个指令

filterPeople

包含带有过滤列表选项的单选按钮

---

预期结果是，如果我选择一个选项，它将只显示该行的值与选项值匹配的行。实际情况是，无论我选择什么，都会显示所有数据。这是一个范围问题，您的模板有自己的子范围，无法看到彼此中的值，因此，当您在一个模板中设置

personFilter.color

时，您的模板将其用作过滤器时并不知道这一点。您可以使用angularjs batarang或插入一个简单的绑定来调试这些问题（）：

personFilter-json:{{personFilter|json}

---

若要解决此问题，可以在父作用域上设置personFilter对象，并且两个子作用域都将使用继承的对象。请注意，如果在子作用域而不仅仅是属性上设置该对象，它将只在一个子作用域上设置该值，而其他作用域将继续使用继承的对象。您可能应该将控制器置于父控制器上。您的控制器正在为内容栏和侧栏实例化，因此，即使侧栏中没有使用数据，您也要查询您的人员两次…

奇怪的是，我可以在控制器中为“personFilter”设置一个

$scope.$watch

，并且它正确地看到从子模板。如果personFilter的作用域是子视图，那么父视图不应该看不到它的值吗？请参见此处：personFilter被输出到控制台。更新：因此，使其工作的一件事是使用

$scope.$parent.people=…

$scope.$parent.personFilter=…

初始化变量。我只是我被一件事弄糊涂了——我认为，通过为状态和指令指定相同的控制器，它们也将共享相同的作用域。当为不同的对象指定相同的控制器时会发生什么？它们是否各自获得相同控制器的各自实例，具有不同的作用域？如果没有

控制器as…

语法I不要认为有控制器实例，控制器函数只是执行，可以修改传递给它的任何作用域。如果登录控制器函数，可以看到它在两个不同的作用域上运行，并且在监视中只有一个作用域正在更新。（）。如果您使用angularjs batarang chrome扩展，您可以看到创建的所有作用域，或者通过检查html，您可以看到具有

ng scope

属性或类的任何元素都有自己的作用域。

</tbody></table>personFilter json: {{personFilter|json}