オブジェクトを含むデータ結合モデルですが、フィールドに値を表示します

Question

私はAngularJSを初めて使用しています。私は特定の概念を頭に入れようとしています。私はどのように一方向のデータバインディングをうまく実行するかを理解しましたが、複雑なオブジェクトとの双方向バインドを実行する最善の方法を考えることはできません。

HTML

<input type="text" placeholder="Project Lead" ng-model="currentproject.projectLeader.name" /> 

JSが

$scope.ViewProject = function (project) { 
    $http.get('api/projects/' + project.id) 
     .success(function (data) { 
      $scope.currentproject = data; 
     }) 
     .error(function (error) { 
      $scope.status = 'Unable to load selected project data: ' + error.message; 
     }); 
    }; 

物事を単純化するために、projectLeaderはprojectLeader.idとprojectLeader.nameています。

私はinputフィールドにフルprojectLeaderオブジェクトをバインドしようとしていますが、私はinputの値のみがプロジェクトnameを表示したいです。これは理にかなっていますか？フィールドが変更されたときに新しいprojectLeaderを取得するにはどうすればよいですか？その人のためにidを検索するために入力された名前でサーバに別の要求を呼び出すそのフィールドにng-changeを実行するのが最善でしょうか？スコープを変更しますか？

Answer 1

オブジェクト全体を入力フィールドにバインドしないでください。名前のみを入力テキストにバインドします。 ng-changeを使用しないでください。変更が入力フィールドを変更するたびに起動されるため、ユーザーがキーを押すたびにデータを保存するメソッドが起動します。代わりに、提出するためのボタンを置くか、またはプレスに入るときにそれを行うことができます。私はあなたのためにフィドルを立てようとします。