전화 튜토리얼에서 작업하는 동안이 사용 사례를 구현하는 방법이 궁금했습니다.
add phoneaddItem가 실행되고 phone.id전달됩니다.여기에서 내 코드 펜 데모를 찾을 수 있으며 이것은 관련 코드입니다.
<ul class="phones">
<li ng-repeat="phone in phones | filter:query | orderBy:orderProp">
<b>{{phone.name}} </b>
<i ng-click="addItem(phone.id)"> add phone</i>
<input name='{{phone.id}}'
value='{{phone.qty}}'
ng-readonly='{{phone.orderReadonly}}' /><br />
<p>{{phone.snippet}} </p>
</li>
</ul>
및 자바 스크립트
var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.controller('PhoneListCtrl', function($scope) {
$scope.phones = [
{'id': 1, 'name': 'Mui 1'
,'snippet': 'Our newcomer from asia.'
,'orderReadonly' : 'false', 'qty': 4}
....
,{'id': 4, 'name': 'Msft Lumia™'
,'snippet': 'Who knows what windows 10 will bring'
,'orderReadonly' : 'true','qty': 2}
];
$scope.orderProp = 'id';
$scope.addItem = function(phone_id) {
// from http://stackoverflow.com/questions/15610501/
var found = $filter('filter')($scope.phones, {id: phone_id}, true);
if (found.length) {
found[0].qty = found[0].qty + 1;
} else {
$scope.selected = 'Not found';
}
}
});
var found = $filter('filter')($scope.phones, {id: phone_id}, true); // found in http://stackoverflow.com/questions/15610501/ <i>add phone</i>왜 qty작동 하지 않는지 모르겠습니다. 필터가 일치하는 항목을 찾지 못하면 작동해야합니다.
하지만이 일을해서는 안됩니다. id객체의을 전달한 다음 속성을 변경할 객체를 찾는 대신 객체 phone자체를 전달하면 됩니다.
<i ng-click="addItem(phone)"> add phone</i>
그런 다음 컨트롤러에서 다음을 수행하십시오.
$scope.addItem = function(phone) {
phone.qty = phone.qty + 1;
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다