ng-model内で "+"演算子を使用するとテキストボックスの値を編集できません

Question

"firstName"と "LastName"の値を初期化するためにng-initを使用しました。ここでng-model = "firstName"またはng-model = "lastName"を設定すると、Textboxの値を編集できます。

ng-model = "firstName + lastName"と設定すると、値がマップされますが、テキストボックスで編集できません。

なぜそうですか？

<div ng-app="" ng-init="firstName='John';lastName='Doe'"> 
<p>Input something in the input box:</p> 
<p>Name: <input type="text" ng-model="firstName+lastName"></p> 
<p>You wrote: {{ firstName + lastName}}</p> 
</div> 

Answer 1

あなたのHTMLにこのような何かを行うことができます

<div ng-init="firstName='John';lastName='Doe'"> 
<p>Input something in the input box:</p> 
<p>Name: <input type="text" ng-model="firstName"></p> 
<p>You wrote: {{ firstName + lastName}}</p> 
<p ng-init="fullname = firstName + lastName">Full Name: <input type="text" ng-model="fullname"></p> 
<p>You wrote: {{ fullname}}</p> 
</div> 

だけng-initに新しいスコープオブジェクトを作成したり、他のあなたのJSにスコープオブジェクトを初期化することができますし、あなたのng-modelとして表示することを使用テキストボックス。