ng-model和值组合不适用于输入文本框

Question

我有两个输入文本框.我需要将输入的值组合在两个文本框中,并在第三个文本框中显示.如果我只value在第三个文本框中使用,我可以显示它.

方框1:

 <input type="text" ng-model="entity.name">

方框2:

 <input type="text" ng-model="entity.code">

方框3:方框1 +方框2

  <input type="text" value="{{entity.name+ ' + ' + entity.code}}">

但是,如果我在第三个框中使用模型名称,则逻辑似乎不起作用:

 <input type="text" value="{{entity.name+ ' + ' + entity.code}}" 
        ng-model="entity.fullCode">

任何人都可以建议修复？

Answer 1

这是一个很好的问题,因为它说明了"Angular中的思考"是如何导致问题的.

使用Angular,您首先要使用模型.然后视图绑定到模型并反映它 - 而不是反过来.我的意思是ng-value不会设置模型,尽管它会改变视图.您(或更确切地说,控制器)负责设置模型.

所以,如果你需要entity.fullCode等于的串联entity.name和entity.code,那么你应该在控制器中进行设置.

例如,如果您想随时设置entity.name或entity.code更改,那么您可以这样做$watch:

$scope.$watch("entity.name + entity.code", function(newVal){
   $scope.entity.fullCode = $scope.entity.name + "+" + $scope.entity.code;
})

但请注意,由于您绑定entity.fullCode到另一个输入,因此更改该输入将会更改entity.fullCode,并且不会使其等于+前两个输入.