angularjs - ng-switch 不绑定 ng-model [英] angularjs - ng-switch does not bind ng-model

查看:27
本文介绍了angularjs - ng-switch 不绑定 ng-model的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有这个副本 http://embed.plnkr.co/nVCmukG5abpi1Y4ZHkrq 当我点击Title3"并输入时显示文本框中的一个值,尽管输入的值显示在 UI 中,但当我单击单击"按钮时,范围属性 $scope.test 没有任何绑定.

I have this repro http://embed.plnkr.co/nVCmukG5abpi1Y4ZHkrq that show when I click 'Title3' and enter a value in text box although the entered value shows reflected in the UI, when I click the 'click' button nothing is binded for the scope attribute $scope.test.

我不知道 ng-switch 有什么问题,或者我做错了什么.感谢帮助!!!

I don't know what is wrong with ng-switch or maybe I'm doing something wrong. Help is appreciated!!!

http://embed.plnkr.co/nVCmukG5abpi1Y4ZHkrq

推荐答案

这是一个范围继承问题,因为 ng-switch 创建了自己的范围.

This is a scope inheritance problem due to ng-switch creating its own scope.

经常提出的一个建议是始终在模型上使用.原因是当控制器作用域项是对象而不是基元时,子作用域将创建对初始对象的引用.如果模型是原始模型,则不会更新原始模型.

One recommendation made often is always to use a dot on models. The reason is that when the controller scope item is an object and not a primitive, sub scopes will create a reference to the initial object. If model is a primitive it will not update the original.

例如:

<input ng-model="test.value" placeholder="pre" type="text" />

$scope.test={value:''}

另一种方法是在html模型标记中使用$parent:

Another approach is to use $parent in html model markup:

<input ng-model="$parent.test" placeholder="pre" type="text" />

使用 dot 方法是避免这些问题的好方法,因为您无需考虑更深的嵌套范围.

Using the dot methodology is a good practice to avoid these issues as you don't need to think about deeper nested scopes.

使用 test.value 作为模型的演示:http://plnkr.co/edit/CkiF55bLXsYzR6ZjcrJp?p=preview

Demo using test.value as model: http://plnkr.co/edit/CkiF55bLXsYzR6ZjcrJp?p=preview

关于模型中 dot 的参考(有价值的阅读):https://github.com/angular/angular.js/wiki/Understanding-Scopes

Reference regarding dot in models(valuable reading): https://github.com/angular/angular.js/wiki/Understanding-Scopes

这篇关于angularjs - ng-switch 不绑定 ng-model的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆