我试图通过AngularJS中的模型，视图和指令的设计来解决问题。基本上我有一个按类别填充在页面上的产品列表，每个产品都添加了数量字段。我需要这些数量字段与我返回并发布到服务器的orderItem数组进行双向绑定。
目前，当我更改产品的数量字段时，我可以使用新的orderItem来更新oc.order.orderItems数组。但是当我尝试填充先前的订单时，我无法更新模型和视图。我的大多数问题源于我应该如何处理与我的指令绑定的数量字段的ngModel属性。
以下是我的一些代码示例（略微删除）。如果有任何需要澄清以帮助协助，因为我知道这听起来很混乱，请告诉我。
产品型号：
var product = { id: 1, category_id: 1, name: 'Apple' };
OrderItem模型：
var orderItem = { id: 1, order_id: 1, product_id: 1, quantity: 2 };
查看：
<div ng-repeat="category in oc.categories">
<h2>{{ category.name }}<h2>
<div ng-repeat="product in category.products">
<h3>{{ product.name }}</h3>
<input type="number" placeholder="Quantity"
order-item="product" ng-model="oc.order.orderItems[$index]" />
</div>
</div>
指令：
angular
.module('OrderApp')
.directive('orderItem', function ($window) {
return {
restrict: 'A',
scope : {
product: '=orderItem'
},
require: 'ngModel',
link: function (scope, element, attrs, ngModelCtrl) {
ngModelCtrl.$parsers.push(function (viewValue) {
if (!viewValue > 0) return;
if (!scope.id) scope.id = 0;
if (!scope.order_id) scope.order_id = 0;
return {
id: scope.id,
order_id: scope.order_id,
quantity: viewValue,
product_id: scope.product.id
};
});
ngModelCtrl.$formatters.push(function (modelValue) {
if (!modelValue) return;
if (!modelValue.id) scope.id = modelValue.id;
if (!modelValue.order_id) scope.order_id = modelValue.order_id;
return modelValue.quantity;
});
}
};
});
（指令似乎根本不正确，不知道在哪里放置视图$ render和scope $ watch）