2017-07-10 13 views
0

これはng-model上で<input name="Name" type="text" id="Name" class="step-input" placeholder="NAME*" readonly="readonly" ng-model="(ContactPerson)+(ContactPersonSurname)" /> ですが、2つのフィールドを連結してうまく動作しますが、angleを使って(ContactPerson)と(ContactPersonSurname)の間にスペースを追加したいと思います。それをどうすれば実現できますか?あなたはNG-モデルディレクティブの内部表現を提供する場合angularjsはng-modelに空白を追加します

答えて

0

あなたはAngularjs documentationでは、彼らは明らかに

このエラーは表現ngModelディレクティブがバインドされている場合に発生する非割り当て可能表現であると述べ、[ngModel:nonassign]エラーが発生します。
常にngModelディレクティブでバインドされた式を割り当てることができることを確認してください。

ソリューション:
次のようにあなたのhtmlでこれを使用し、その後
$scope.fullName = (ContactPerson)+ ' ' +(ContactPersonSurname);のような新しい$スコープ変数いろいろ書いを作成します。

angular.module('mainApp', []) 
 
    .controller('mainCtrl', function ($scope) { 
 
     $scope.name = "john"; 
 
     $scope.surName = "Doe"; 
 
     $scope.fullName = $scope.name + " " + $scope.surName; 
 
    });
<html ng-app="mainApp"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body ng-controller="mainCtrl"> 
 
    <input type="text" ng-model="fullName" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
 
</body> 
 
</html>

0

あなたの入力フィールドは読み取り専用です。だから、あなたはバインディングモデルの代わりにexpressinを使うことができます。

var myApp = angular.module('myApp',[]); 
 

 
function MyCtrl($scope) { 
 
    $scope.ContactPerson = 'foo'; 
 
    $scope.ContactPersonSurname = 'bar'; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp"> 
 

 
<div ng-controller="MyCtrl"> 
 
    <input name="Name" type="text" id="Name" class="step-input" readonly="readonly" value="{{ContactPerson}} {{ContactPersonSurname}}" /> 
 
</div> 
 
</div>

ホープこれはあなたの問題を解決します。

関連する問題