AngularJS - Scope Not Updating

Question

For some reason, I can't remove the description and packing elements/fields (see picture) from the scope variable, even after deleting their respective code and restarting the application. Any help is much appreciated.

My directive:

app.directive('formElement', function() {
  return {
    restrict: 'E',
    transclude: true,
    scope: {
        label : "@",
        model : "="
    },
    link: function(scope, element, attrs) {
        scope.disabled = attrs.hasOwnProperty('disabled');
        scope.required = attrs.hasOwnProperty('required');
        scope.pattern = attrs.pattern || '.*';
        console.log(element);
    },
    template:
    '' +
    ' {{label}}' +
    '' +
    '' +
    ''
  };     
});

My controllers:

 app.controller('ProductsCtrl', function ($scope, $modal, $filter, Data) {
        $scope.product = {};
        Data.get('products').then(function(data){
            $scope.products = data.data;
        });
        $scope.changeProductStatus = function(product){
            product.status = (product.status=="Active" ? "Inactive" : "Active");
            Data.put("products/"+product.id,{status:product.status});
        };
        $scope.deleteProduct = function(product){
            if(confirm("Are you sure to remove the product?")){
                Data.delete("products/"+product.id).then(function(result){
                    $scope.products = _.without($scope.products, _.findWhere($scope.products, {id:product.id}));
                });
            }
        };
        $scope.open = function (p,size) {
            var modalInstance = $modal.open({
                templateUrl: 'partials/product-edit.html',
                controller: 'ProductEditCtrl',
                size: size,
                resolve: {
                    item: function () {
                        return p;
                    }
                }
            });
            modalInstance.result.then(function(selectedObject) {
                if(selectedObject.save == "insert"){
                    $scope.products.push(selectedObject);
                    $scope.products = $filter('orderBy')($scope.products, 'id', 'reverse');
                }else if(selectedObject.save == "update"){
                    p.price = selectedObject.price;
                    p.stock = selectedObject.stock;
                }
            });
        };

        $scope.columns = [
            {text:"ID",predicate:"id",sortable:true,dataType:"number"},
            {text:"Name",predicate:"name",sortable:true},
            {text:"Price",predicate:"price",sortable:true},
            {text:"Stock",predicate:"stock",sortable:true},
            {text:"Status",predicate:"status",sortable:true},
            {text:"Action",predicate:"",sortable:false}
        ];
    });

    app.controller('ProductEditCtrl', function ($scope, $modalInstance, item, Data) {

        $scope.product = angular.copy(item);

        $scope.cancel = function () {
            $modalInstance.dismiss('Close');
        };
        $scope.title = (item.id > 0) ? 'Edit Product' : 'Add Product';
        $scope.buttonText = (item.id > 0) ? 'Update Product' : 'Add New Product';

        var original = item;
        $scope.isClean = function() {
            return angular.equals(original, $scope.product);
        };

        $scope.saveProduct = function (product) {
            product.uid = $scope.uid;
            if(product.id > 0){
                Data.put('products/'+product.id, product).then(function (result) {
                    if(result.status != 'error'){
                        var x = angular.copy(product);
                        x.save = 'update';
                        $modalInstance.close(x);
                    }else{
                        console.log(result);
                    }
                });
            }else{
                product.status = 'Active';
                Data.post('products', product).then(function (result) {
                    if(result.status != 'error'){
                        var x = angular.copy(product);
                        x.save = 'insert';
                        x.id = result.data;
                        $modalInstance.close(x);
                    }else{
                        console.log(result);
                    }
                });
            }
        };
    });

HTML:

product-edit.html (partial):


      Edit product [ID: {{product.id}}]


    

        
            
        

        
            
             Enter the price.
        

       
            
             Enter the available stock.
        


        
            
                
                    Cancel

products.html (partial):



    


        
            
        

        
            
        


    

    

        
        

        

             No data found

             Loading

            {{c.text}}

            

                {{c.id}} {{c.name}} {{c.price}} {{c.stock}}

AngularJS - Scope Not Updating

Answers (1)

Related Questions