Angular - 在 ngInclude 中调用时 ngModel 不更新 [英] Angular - ngModel not updating when called inside ngInclude

问题描述

首先，plunker:http://plnkr.co/edit/v1uTz5>

这是我遇到的问题的工作演示.

我有一个 ng-include 来包含一个部分.

在部分内部，我有一个带有 ngModel AND 指令的文本输入.

模型在包含内相应地更新，但包含外的任何交互都将被忽略.包含外部的 {{test}} 不会更新，但内部的 {{test}} 会更新.

指令在调用时处理 enter 键并调用正确的作用域和函数.但是，$scope.test 变量从未更新过，但是 $scope.testFinal 已更新，并且 ng-include 模板会适当地呈现它.尝试重置 $scope.test 模型也不起作用.

我在这里遗漏了什么吗?或者这是指令或 ng-include 的错误?

解决方案

与其使用原语来定义变量，不如让它成为一个对象.

$scope.model={test:''};

指令为每个项目创建自己的范围.当你将一个原始变量等同于一个新的作用域变量时，它没有绑定到原始变量，但是当原始变量是一个对象时，将创建一个引用，而不是一个副本，并且在一个变量中所做的更改将反映在另一个中

简单说明示例:

var a ='foo';var b= a;/* 现在改变一个 */a='条';alert( b)//仍然是 'foo'

现在对对象做同样的事情:

var obj_1= {a:'foo'};var obj_2=obj_1;/* 现在改变 obj_1.a*/obj_1.a='bar';alert( obj_2.a)//更改为 obj_1 也会更改 obj_2 并且 alert 返回 "bar"*/

您的 Plunker 已修改

阅读这篇关于 angular wiki 的文章了解更多信息详细说明

First and foremost, the plunker: http://plnkr.co/edit/v1uTz5

This is a working demo of the issue I am running into.

I have a ng-include to include a partial.

Inside the partial I have an text input with ngModel AND directive.

The model updates accordingly inside the include, but any interaction outside the include is ignored. The {{test}} outside the include doesn't update, but the {{test}} inside does.

The directive, when called, handles the enter key and calls the correct scope and function. However, the $scope.test variable has never been updated, but $scope.testFinal is updated and the ng-include template renders it appropriately. Trying to reset the $scope.test model does not work either.

Am I missing something here? Or is this a bug with the directive or with the ng-include?

解决方案

Instead of using a primitiive to define the variable, make it an object.

$scope.model={test:''};

Directives create their own scope for each item. When you equate a primitive to a new scope variable, it has no binding to the original, however when original is an object, a reference is created , not a copy, and changes made in one will reflect in the other

Simple explanatory example:

var a ='foo';
var b= a;
/* now change a*/
a='bar';
alert( b) // is still 'foo'

now do the same with object:

var obj_1= {a:'foo'};
var obj_2=obj_1;
/* now change obj_1.a*/
obj_1.a='bar';
alert( obj_2.a) // change to obj_1 will also change obj_2 and alert returns "bar"*/

Your Plunker Modified

Read this article on angular wiki for more detailed explanation

这篇关于Angular - 在 ngInclude 中调用时 ngModel 不更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！