как скрыть смарт-таблицу после удаления всех строк?

Я показываю смарт-таблицу, используя ng-show и sg-hide ..условие: данные равны нулю, тогда скрывается таблица, и существуют данные, показывающие таблицу. Он работает каждый раз, когда загружается новая страница, но я хочу применить, если таблица очищена путем удаления строк. angularjs и smarttable — это ресурсы

При первой загрузке следует ng-hide и ng-show для отображения таблицы или другого div. Если нет данных для отображения, то я скрываюсь, иначе существуют данные, которые я показываю, когда я очистил все строки, удалив строку, а затем после удаления всех строк... тогда ng-hide не работает. Я использую angularjs и smarttable

HTML

<div `enter code here`ng-hide="hasdata"->
<smarttable></smarttable>
</div>
<div `enter code here`ng-show="hasdata">
NO data to disply
</div>

Контроллер

$scope.columncollection;$scope.rowcollection и используя http для получения данных и заполнения объекта rowcollection. и мы удаляем строку с помощью пользовательской директивы. При первой загрузке, если длина данных равна нулю, она работает нормально, но строка удаляется, а затем не скрывается.


angularjs smart-table
person user3523448    schedule 06.05.2014    source источник
comment
Можете ли вы опубликовать соответствующий код, пожалуйста   -  person Tim    schedule 06.05.2014

Ответы (3)


arrow_upward
1
arrow_downward

Ваша таблица не скрывается, потому что вы, вероятно, не изменили значение hasdata на false после удаления содержимого таблицы.

Попробуй это,

В html,

<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <script data-require="[email protected]" data-semver="1.0.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="smart-table.js"></script>
    <script src="script.js"></script>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
  </head>

  <body ng-controller="mainCtrl">
    <h1>{{greetings}} Plunker!</h1>
    <div ng-show="hasdata">
    <smart-table  config="globalConfig" columns="columnsConfig" rows="items"></smart-table>
  </div>

  </body>

</html>

В JS-файле

var app=angular.module('myApp',['smartTable.table']);

app.controller('mainCtrl',['$scope',function(scope){
  scope.greetings='hello';
  scope.hasdata=true;
  scope.doDelete = function(index) {
  // alert("index "+index);
   scope.items.splice(index,1);

    if(scope.items.length===0){
    //alert("scope.items.length "+scope.items.length);
    scope.hasdata=false;
  }

  }




scope.items=[
    {name:'mahesh',lastName:'kumar'},
    {name:'sachin',lastName:'ramesh'},
    {name:'varun',lastName:'gupta'},
    {name:'vijay',lastName:'kumar'},
    {name:'prem',lastName:'raj'},
    {name:'gandhi',lastName:'gandhi'},
    {name:'sathish',lastName:'kumar'},
    {name:'ram',lastName:'prasad'},
    {name:'siva',lastName:'guru'},
    {name:'dilli',lastName:'ganesh'}
    ];

  scope.globalConfig={
    isPaginationEnabled:false,
    selectionMode:'single'
  };

  scope.columnsConfig=[
    {label:'name',map:'name'},
    {label:'last Name',map:'lastName'},
    {label:'actions',cellTemplateUrl:'delete.html'}
    ];




}])

В файле delete.html

<button ng-click="$parent.$parent.$parent.$parent.doDelete(displayedCollection.indexOf(dataRow))"
    class="btn btn-xs btn-primary">
        Delete
</button>

Взгляните на рабочую демонстрацию в plunker.

Надеюсь, это решит вашу проблему :)

person MaheshKumar    schedule 22.07.2014

arrow_upward
0
arrow_downward

Если вы уверены, что условие скрытия истинно (данные равны нулю) после удаления всех строк таблицы, что вы можете проверить, регистрируя (console.log) условие после удаления каждой строки, то вам, вероятно, просто нужно выполнить $scope.apply() или $scope.digest() для убедитесь, что ваше представление обновлено.

Если вы добавите свой код к вопросу, вам будет легче дать более полный ответ.

person biofractal    schedule 06.05.2014

arrow_upward
0
arrow_downward

Вероятно, вам придется обернуть код, удаляющий строки, в вызов $apply.

$scope.$apply(function() {
    //delete rows here
})
person link    schedule 06.05.2014
comment
После удаления всех строк в таблице данные пусты в таблице, поэтому ng-hide должен применяться немедленно. - person user3523448; 06.05.2014
comment
Как удалить строки? Вы должны удалить их в массиве, который вы используете в качестве модели для таблицы. - person link; 06.05.2014