私は AngularJS を初めて使用し、何ができるかを調べようとしています。私は単純なフォームを持っています:
<div ng-controller="EditContactCtrl">
<div class="row-fluid" ng-repeat="email in contact.emails">
{{email.type}} - {{email.email_address}}
</div>
<form name="emailForm" ng-controller="EditContactCtrl" ng-submit="addEmail()">
<select class="span4" name="type">
<option vlaue="Work">Work</option>
<option vlaue="Personal">Personal</option>
<option vlaue="Other">Other</option>
</select>
<input class="span6" type="text" name="email_address" placeholder="Email Address">
<input type="submit" class="btn span2 pull-right" value="Add"/>
</form>
</div>
コントローラーには、連絡先オブジェクトに新しいメールアドレスをプッシュする簡単なアクションがあります。
function EditContactCtrl($scope, Contacts, $routeParams){
$scope.contact = {emails:[], contact_numbers: [], addresses: []};
$scope.isNew = $routeParams.contactId == '';
if(!$scope.isNew){
$scope.contact = Contacts.get({contactId: $routeParams.contactId});
}
$scope.addEmail = function(){
$scope.contact.emails.push({type:emailForm.type.value, email_address: emailForm.email_address.value});
console.log($scope.contact.emails);
emailForm.reset();
}
}
このコードを実行すると、すべて問題なく実行され、連絡先オブジェクトの電子メール リストに新しい電子メール アドレスが追加されていることがわかります。しかし問題は、その UI が新しい電子メール アドレスで更新されていないことです。私が持っている場所の上に新しいアドレスを吐き出すことを期待していますng-repeat="email in contact.emails"