0
我正在使用AngularJS并尝试使用加载产品。ng-change没有更新视图AngularJS
$scope.update=function(){
$scope.loading = true;
$scope.brandString=$scope.brands.join(':');
UpdateService.getProducts($scope).then(function (data) { $scope.loading = false; $scope.products = data.Products;}, function() {
});
};
$scope.changepage=function(pagenum){
$scope.pagenumber=pagenum;
$scope.update();
};
$scope.changeorderby=function(orderby){
$scope.orderby=orderby;
$scope.pagenumber=1;
$scope.update();
};
$scope.updatebrands=function(id){
var index = $scope.brands.indexOf(id);
// Add if checked
if ($('#'+id).is(':checked')) {
if (index === -1) $scope.brands.push(id);
}
// Remove if unchecked
else {
if (index !== -1) $scope.brands.splice(index, 1);
}
$scope.update();
};
我的第二和第三个函数,即changepage
和changeorderby
工作正常和更新视图中。在复选框更改时调用的第四个函数也会从服务器返回适当的数据,但不会更新我的视图。
代码复选框。
<div class="listbox">
<ul>
<div ng-class="{active : item.Checked, inactive:!item.Checked}" ng-repeat="item in brandDetails" style="padding:1px 0">
<div ng-class="{divchecked : item.Checked, divunchecked:!item.Checked}">
<input type="checkbox" id="{{item.Id}}" ng-change="updatebrands(item.Id)" ng-model="item.Checked" name="{{item.Name}}" value="{{item.Id}}" style="opacity:0" class="brandName ng-pristine ng-valid" /></input>
</div>
<span style="margin-left: 8px; font-size: 11px;top: -1px;position: relative;">{{item.Name}}</span>
</div>
</ul>
</div>
我在这里错过了什么?
除了你原来的问题,你的HTML标记在几个地方f.e. 'div'不允许是'ul'的直接子元素或''是一个自闭元素,它没有结束标记。你的内联样式也有错误,'span'需要'display'属性设置为'block'或'inline-block',以便相应地显示边距。 – 2014-09-20 09:56:22
也不使用value =“{{item.Id}}”ng-model注意 – Endless 2014-09-20 10:05:31
也不应该以id /“{{item.Id} }“) – Endless 2014-09-20 10:41:52