Функция удаления всех событий, если условие не работает - PullRequest
0 голосов
/ 20 апреля 2019

Я написал программу с Knockout, используя observableArray, и я хочу удалить элемент из этого массива на основе условия. Но это не работает, моя программа выглядит так:

 var app = function (appname, appdesc,isactive) {
            this.appname = appname;
            this.appdesc = appdesc;
            this.active = isactive;
        }
        var mainVM = function () {
            var app1 = new app('sap', 'sap b1', false);
            var app2 = new app('Magento', 'Magento 1', false);
            //this.appList = ko.observableArray();
            this.appList = ko.observableArray([app1, app2]);
        }
        var appVM = new mainVM();
        ko.applyBindings(appVM)

$('#btnDel').click(function () {

            appVM.appList.removeAll([{ "active": false }]);
        })

1 Ответ

0 голосов
/ 21 апреля 2019

Вы пытаетесь выполнить функцию removeAll, отправив параметр {'active': false}. Другими словами, вы просите Knockout определить, равен ли какой-либо из app экземпляров внутри appList объекту {'active': false}. Они не равны!

Это приложение1:

{
   appname: 'sap',
   appdesc: 'sap b1',
   active: false
}

Это приложение 2:

{
   appname: 'Magento',
   appdesc: 'Magento 1',
   active: false
}

И параметр, который вы передаете для сравнения, таков:

{
   active: false
}

Они очень разные.


Даже если вы создаете 2 экземпляра с одинаковыми входами, они не равны. Смотрите здесь:

var app = function (appname, appdesc,isactive) {
    this.appname = appname;
    this.appdesc = appdesc;
    this.active = isactive;
}

var app1 = new app('moo', 'coo', false);
var app2 = new app('moo', 'coo', false);

document.getElementById('secret').innerHTML = (app1 === app2);
is app1 equal to app2?

<br><br>

<span id="secret"></span>

Таким образом, исходная опция, которую я предложил, remove, является правильной функцией для вас, когда вы имеете дело с объектами.

var app = function (appname, appdesc,isactive) {
            this.appname = appname;
            this.appdesc = appdesc;
            this.active = isactive;
        }
        var mainVM = function () {
            var app1 = new app('sap', 'sap b1', true);
            var app2 = new app('Magento', 'Magento 1', false);
            //this.appList = ko.observableArray();
            this.appList = ko.observableArray([app1, app2]);
        }
        var appVM = new mainVM();
        ko.applyBindings(appVM)

        $('#btnDel').click(function () {

            appVM.appList.remove(function(item){
              return !item.active;
            });
        })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<!-- ko foreach: appList -->
<span data-bind="text: ko.toJSON($data)"></span>
<br>
<!-- /ko -->

<br><br>
<button id="btnDel">Delete</button>

removeAll с параметрами полезен только в этом сценарии, где это примитивный тип данных:

var mainVM = function () {
            
            this.appList = ko.observableArray([false, true]);
        }
        var appVM = new mainVM();
        ko.applyBindings(appVM)

        $('#btnDel').click(function () {

            appVM.appList.removeAll([false]);
        })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<!-- ko foreach: appList -->
<span data-bind="text: ko.toJSON($data)"></span>
<br>
<!-- /ko -->

<br><br>
<button id="btnDel">Delete</button>
...