2017-03-18 86 views
0

我有两个输入框。无论第一个输入框输入什么,都应该显示在第二个输入框中,这很容易。但是,如果我在第二个输入框中输入了某些内容并尝试首先显示它不起作用。AngularJs中的反向绑定

这是代码。

<div ng-app=""> 
    <input type="text" ng-model="first" value={{second}}> 
    <input type="text" value={{first}} ng-model="second"> 
</div> 

是不是允许使用Angular?

回答

1

如果有两个输入框共享相同的值是你想要的,那么为ng模型分配相同的范围变量也可以。

<div ng-app=""> 
    <input type="text" ng-model="form.sameName"> 
    <input type="text" ng-model="form.sameName"> 
</div> 

并建议对ng模型变量使用点符号。

+0

你能解释为什么我的代码不工作? – WeAreRight

+0

如果我有四个输入框,前两个具有相同的值绑定,另外两个具有相同的值绑定,会怎样?那么这些输入框的“ng-model”是什么。 – WeAreRight

1

你更接近,使用相同的NG-模型两个输入,

<input type="text" ng-model="data"> 
<br> 
    <input type="text" ng-model="data"> 
<br> 

DEMO

var myApp = angular.module('myApp', []); 
 
myApp.controller('TestCtrl', ['$scope', function($scope) { 
 

 
}]);
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script data-require="[email protected]*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script> 
 
<link rel="stylesheet" href="style.css" /> 
 
</head> 
 
<body ng-app="myApp"> 
 
<div ng-controller="TestCtrl"> 
 
    <input type="text" ng-model="data"> 
 
    <br> 
 
    <input type="text" ng-model="data"> 
 
    <br> 
 
    </div> 
 
</body>

+0

你能解释我的代码不工作的原因吗? – WeAreRight

+0

@WeAreRight,因为您有两种不同的型号 – Sajeetharan

+0

@ 32theeths提供的解决方案如何?它看起来有点容易记住。 – WeAreRight