AngularJS，绑定开关的范围？

Question

为了更好地掌握AngularJS，我决定使用其中的一个示例，特别是简单地在Todo-example中添加一个“完整”的屏幕，当用户输入了5个todo，它使用一个switch-case切换到另一个div。代码可以在http://jsfiddle.net/fwchu/1/，如果有用的话。

但是，似乎每个switch-case都有自己的作用域($scope.todotext不可用），但是在本例中，可以从addTodo（）中使用“this”访问它。到目前为止还不错，但是假设我想访问开关外壳之外的todoText（它在开关外壳内），我该怎么做呢？我是否可以将switch-case范围绑定到模型，它是否可以以其他方式访问，或者应该以其他方式解决这个问题？

我不是想找到上面代码的任何解决方案，我很确定我知道如何解决它而不使用开关-案例，我想了解作用域在这种情况下是如何工作的！

Answer 1

马克有一些很棒的建议！确保您还查看了AngularJS Batarang Chrome扩展，以查看各种作用域及其值（以及其他内容）。注意，它似乎不能很好地与jsfiddle一起工作。

我不知道如何直接访问内部作用域，但这里有一种方法可以通过绑定到对象而不是基元来访问外部作用域中的相同文本。

1）在控制器中声明TodoText为对象而不是基元：

$scope.todoText = {text: ''};

<form ng-submit="addTodo()">
    <input type="text" ng-model="todoText.text" size="30" placeholder="add new todo here">
    <input class="btn-primary" type="submit" value="add">
</form>

$scope.addTodo = function() {
    $scope.todos.push({text:$scope.todoText.text, done:false, width: Math.floor(Math.random() * 100) + 50});
    $scope.todoText.text = '';
};

请看一下这个小提琴，并注意，当您键入某些内容时，文本框下面显示的文本正在访问外部作用域上的todoText.text。

如果将代码改回使用原语（如本小提琴中所示），父作用域TodoText将不会反映对TextBox所做的任何更改。这可能更多地与JavaScript如何复制引用值有关（更多信息请参见本文），而与AngularJS无关。