javascript - angularのチェックボックスを使用してファクトリオブジェクトを変更する

Question

私は電話帳アプリを構築しています。「お気に入り」のブール値を持つ連絡先があります。私の連絡先は工場から来ています。アプリの連絡先リストから名前をクリックすると、右側に連絡先の詳細が部分的に表示されます。したがって、次のようになります。

連絡先リスト:

<ul>
<li ng-repeat="person in people" ng-click="showDetails(person)">
...

メインコントローラー (OK ここで、これは最善の方法ではないと感じています。):

var selectedPersonName = null;

$scope.showDetails = function(person){
    $scope.selectedPersonName = person.name;
    $scope.selectedPersonCity = person.city;
}

連絡先の詳細の一部:

<span ng-show="selectedPersonName == null">Select contact</span>

<ul class = "contact-details" ng-hide="selectedPersonName == null">
    <li>{{selectedPersonName}}</li>
    <li>{{selectedPersonCity}}</li>
</ul>

また、チェックされているかどうかに関係なく、フレンドのステータスを変更するチェックボックスを表示したいと思います。いくつかのバリエーションを試しましたが、チェックボックスにオブジェクトの実際の true/false ステータスを表示することはできましたが、クリック時にオブジェクトの状態を変更するものはありませんでした。アプリの現在の「アーキテクチャ」に関するコメントやアドバイスをいただければ幸いです。