简体   繁体   中英

AngularJs ng-repeat didn't updated after changing $scope variable

I have table with item list and modal window where i can change drug properties. When properties changed that drug have to remove from that list. But it's didn't remove.

Modal window:

 $modal.open({
    templateUrl:'app/interactions/partials/modals/resolveDrug.html',
    controller: 'DrugsListController',
    scope: $scope
}).result.then(function(data){
    var index = _.findIndex($scope.drugs, {_id: data._id});
    $scope.drugs.splice(index,1);
}

i think element didn't remove 'cause when i open modal window i create copy of my scope and then work with copy..

On that form i have refresh button that refresh all list.

 $scope.refresh= function() {
    $scope.drugs = UnresolvedDrugsService.query();
};

and it's didn't work too. I think it happens because i work with copy too. Okey, i try to emit some event

$modal.open({
    templateUrl:'app/interactions/partials/modals/resolveDrug.html',
    controller: 'DrugsListController',
    scope: $scope
}).result.then(function(data){
    var index = _.findIndex($scope.drugs, {_id: data.data._id});

    $rootScope.$emit('refreshDrug', index);

}

$rootScope.$on('refreshDrug', function(index){
    $scope.drugs = [];
    $scope.drugs.splice(index,1);
   // $scope.drugs= UnresolvedDrugsService.query();
});

And it's not working.

Can you help me and describe what i doing wrong, thx!

UPD modal window html

<form role="form" name="resolveDrugForm"  ng-submit="saveResolvedDrug(drug) && $close(drug)">
   ........{some code, input's and label}......
<input type="submit" class="btn btn-primary" value="{{'COMMON.SAVE' | translate}}"/>
<button type="button" class="btn btn-default" ng-click="$dismiss()" >{{'COMMON.CANCEL' | translate}}</button>

code of ng-repeat

<tr ng-repeat="drug in drugs" ng-click="resolveDrug($index)">
            <td>{{drug.productName || drug.description }}</td>
            <td>{{drug.aiccode  }}</td>
</tr>

and all method of controller:

 $rootScope.$on('refreshDrug', function(index){
       // $scope.drugs = [];
        $scope.drugs.splice(index,1);
       // $scope.drugs= UnresolvedDrugsService.query();
    });


    $scope.drugs= UnresolvedDrugsService.query();

    $scope.refresh= function() {
        $scope.drugs= UnresolvedDrugsService.query();
    };
    $scope.spliceEl = function(data){
        var index = _.findIndex($scope.drugs, {_id: data._id});
        $scope.drugs.splice(index,1);
        return true;
    };
    $scope.saveResolvedDrug = function(drug){
        DrugsService.addResolvedDrug(drug).then(function(data){
            var index = _.findIndex($scope.drugs, {_id: data.data._id});
            if(data.data.ingredients && data.data.ingredients.length > 0){
                data.data.ingredients = JSON.parse(data.data.ingredients);
            }
            $scope.drugs.splice(index,1);
            return true;
        });
        return true;
    };

    $scope.resolveDrug=function(index){
        $scope.drug={};
        var drugs = $scope.drugs;
        $scope.drug=angular.copy($scope.drugs[index]);
        var scope=$scope;
        $modal.open({
            templateUrl:'app/interactions/partials/modals/resolveDrug.html',
            controller: 'DrugsListController',
            scope: $scope
        }).result.then(function(data){
                console.log($scope.drugs);
                var index = _.findIndex($scope.drugs, {_id: data._id});
                //$scope.drugs.splice(index,1);

                console.log($scope.drugs);
                $rootScope.$emit('refreshDrug', index);

            }, function(data){

            }).finally(function(data){
                $scope.refresh();
            });

    }

I didn't know why it didn't works with events. But if saveDrug in modal result but sumbit form - work fine. Now code looks like

   $scope.resolveDrug=function(index){
        $scope.drug={};
        var drugs = $scope.drugs;
        $scope.drug=angular.copy($scope.drugs[index]);
        var scope=$scope;
        $modal.open({
            templateUrl:'app/interactions/partials/modals/resolveDrug.html',
            controller: 'DrugsListController',
            scope: scope,
            resolve: {
                drug: function () {
                    return $scope.drug;
                }
            }
        }).result.then(function(data){
            }, function(data){

            }).finally(function(data){

            });

    }
   $scope.saveResolvedDrug = function(drug){
        DrugsService.addResolvedDrug(drug).then(function(data){
            var index = _.findIndex($scope.drugs, {_id: data.data._id});
            if(data.data.ingredients && data.data.ingredients.length > 0){
                data.data.ingredients = JSON.parse(data.data.ingredients);
            }
            $scope.drugs.splice(index,1);
            return true;
        });
        return true;
    };

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM