当前位置: 首页 > 面试题库 >

AngularJS,绑定范围的情况下?

段干俊茂
2023-03-14
问题内容

为了掌握AngularJS,我决定使用其中一个示例,特别是在Todo示例中简单地添加一个“
complete”屏幕,当用户输入5个todo时,它会使用一个切换案例切换到另一个div。
。如果有任何用处,可以在这里找到代码http://jsfiddle.net/FWCHU/1/。

但是,似乎每个开关盒都有其自己的作用域($ scope.todoText不可用),但是在这种情况下,可以使用addTodo()中的“
this”来访问它。到目前为止,一切都很好,但是说我想在开关盒之外访问todoText(在开关盒内),我该怎么做呢?我是否可以将切换用例范围绑定到模型,是否可以通过其他方式访问它,还是应该以其他方式解决?

PS。我 没有 尝试找到上述代码的任何解决方案,我敢肯定我知道如何在不使用切换用例的情况下解决该问题,我想了解这种情况下作用域的作用!


问题答案:

马克有一些很棒的建议!确保您还签出了AngularJS Batarang
Chrome扩展程序,
以查看各种范围及其值(以及其他内容)。请注意,它似乎无法与jsFiddle一起很好地工作。

我不确定如何直接访问内部作用域,但这是通过绑定到对象而不是原始对象来访问外部作用域中相同文本的一种方法。

1)todoText在您的控制器中声明为一个对象,而不是一个原语:

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

2)绑定到todoText.text而不是todoText

<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>

3)修改现有功能以使用todoText.text

$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将不会反映您对文本框所做的任何更改。这可能与JavaScript复制参考值的方式有关,而与AngularJS无关。



 类似资料:
  • 为了更好地掌握AngularJS,我决定使用其中的一个示例,特别是简单地在Todo-example中添加一个“完整”的屏幕,当用户输入了5个todo,它使用一个switch-case切换到另一个div。代码可以在http://jsfiddle.net/fwchu/1/,如果有用的话。 但是,似乎每个switch-case都有自己的作用域($scope.todotext不可用),但是在本例中,可以从

  • 问题内容: 我正在尝试使用ng- model将复选框绑定到作用域。复选框的初始状态恰好与范围模型相对应,但是当我选中/取消选中复选框时,模型不会更改。需要注意的是,模板是在运行时使用ng- include动态加载的 当我选中该框时,控制台记录为false,而当我取消选中该框时,控制台再次记录为false。我还在作用域上有一个订单模型,如果我将复选框的模型更改为order.billing_is_sh

  • 问题内容: 我想知道如何在给定父范围的情况下获取所有子范围的列表。我可以从该范围的属性中找到$ childHead,$ childTail,$ nextSibling和$$ prevSibling。 我现在使用的方法是从父级获取childHead,然后使用nextSibling获取下一个孩子,直到nextSibling为空。 有没有更好的方法?鉴于我想在所有子项上调用方法[getModel],是否

  • 问题内容: 在Angularjs中,是否有特定的原因要在控制器中使用,并且要在指令链接函数中使用(不使用)?这仅仅是公约还是其他? 问题答案: 该情况下,当你在控制器的依赖注入范围内喷射基于匹配变量名使用,在这种情况下,因为名字是行不通的。 对于指令的情况下,注塑基于位置,所以你可以命名你的变量或或任何东西。链接功能的指令顺序为 因此,第一个元素始终是作用域对象。

  • 问题内容: 在父控制器作用域中,我已定义将其设置为“ x”。然后在子范围中,我使用ngModel 进行了定义: 加载页面后,会按预期正确设置为“ x”。当我选择“ y”时,在CtrlB中$ scope会按预期给出“ y”。 但是,当我检查的范围(使用AngularJS的batarang),它给“X”。 jsFiddle:http : //jsfiddle.net/sudhh/GGKjp/2/ 预览

  • 问题内容: 我有一个带有隔离范围的指令,该指令的值具有两种方式绑定到父范围。我正在调用一个方法来更改父作用域中的值,但是更改未应用到我的指令中。(不触发双向绑定)。 但是我不是从指令中更改值,而是仅在父范围中更改它。我阅读了解决方案,并指出了第五点: 这意味着当我的父值更改为2时,将触发监视。它检查父值和指令值是否相同-如果不相同,则将其复制到指令值。好的,但是我的指令值仍然是1 …我缺少什么?