AngularJS ng-checked未使用模型进行更新

时间:2015-08-26 05:35:01

标签: javascript angularjs

在我的页面上,我有品牌A和品牌B.通过点击一个,我会显示一个已过滤的地址类型列表,然后点击其中一个,然后过滤位置。

当我点击品牌A时,我会保存已检查项目的对象并用品牌B的列表覆盖。当我点击返回品牌A时,位置列表会被正确过滤,但地址类型不会被检查,即使它们存在于数组中。

仅供参考,md-checkbox是Angular Material复选框。

这是我的HTML:

<ul >
    <li id="brandA" ng-click="setBrand(0)" ng-class="{'brandSelected': brand == 0}">
        </span>Brand A</span>

    </li>

    <li id="brandB" ng-click="setBrand(1)" ng-class="{'brandSelected': brand == 1}">
        </span>Brand B</span>
    </li>
</ul>

<div ng-repeat="item in addressTypes | filter : filterAddressTypeByBrand">
    <md-checkbox class="md-primary" ng-checked="exists(item)" ng-click="toggle(item)" ng-model="item.selected">
    {{ item.desc }}
    </md-checkbox>
</div>

这是我的控制器的摘录:

$scope.addressTypesSelected = [];
$scope.addressTypesSelectedBrandA = [];
$scope.addressTypesSelectedBrandB = [];


$scope.toggle = function (item) {
    var idx = $scope.addressTypesSelected.indexOf(item);
    if (idx > -1) $scope.addressTypesSelected.splice(idx, 1);
    else $scope.addressTypesSelected.push(item);
};
$scope.exists = function (item) {
    return $scope.addressTypesSelected.indexOf(item) > -1;
};


$scope.setBrand = function (val) {
    $scope.brand = val;
    $scope.addressTypesSelected = [];

    if ($scope.brand == 1) {
        $scope.addressTypesSelectedBrandB = [];
        $scope.addressTypesSelectedBrandB = angular.copy($scope.addressTypesSelected);

        $scope.addressTypesSelected = angular.copy($scope.addressTypesSelectedBrandA);
    } else {
        $scope.addressTypesSelectedBrandA = [];
        $scope.addressTypesSelectedBrandA = angular.copy($scope.addressTypesSelected);

        $scope.addressTypesSelected = angular.copy($scope.addressTypesSelectedBrandB);
    }

    $scope.filterDealers($scope.dealers);
}

在品牌之间切换时,需要做些什么来检查复选框?

更新1。

我已将ng-model =“item.selected”添加到md-checkbox。这似乎可以解决问题。但是,如果我选中品牌A上的一个方框,然后点击品牌B,然后点击品牌A,复选框仍保持选中状态。如果我继续并单击品牌B,然后再次单击品牌A,则取消选中该复选框,但模型中的值设置为true。

0 个答案:

没有答案