Почему Alight не реагирует на изменение состояния?

Question

[Александр Карпов]

по идее это должно работать:

<div al-app="mainCtrl" >
            <div al-init="search={}">
                Name: <input type="text" al-value="search.name" /> <br/>
                Age: <input type="text" al-value="search.age" /> <br/>
            </div>
            <table class="table table-bordered">
                <tr al-repeat="it in list | smart:search">
                    <td>{{=it.name}}</td>
                    <td>{{=it.age}}</td>
                </tr>
            </table>
        </div>

но когда я меняю значения в input то al-repeat не перестраивает дом
такой вариант рабочий:

<div al-app="mainCtrl" >
            <div al-init="search={}">
                Name: <input type="text" al-value="search.name" /> <br/>
                Age: <input type="text" al-value="search.age" /> <br/>
            </div>
            <table class="table table-bordered">
                <tr al-repeat="it in list | smart:search.name">
                    <td>{{=it.name}}</td>
                    <td>{{=it.age}}</td>
                </tr>
            </table>
        </div>

но такой вариант не позволяет передать объект целиком в фильтр

код JS тут:

alight.controllers.mainCtrl = function(scope) {
                scope.list = [{name:'Alex',age:35},{name:'Masha',age:28}];

            };
            alight.filters.smart = function (name, scope) {
                console.log(name, scope);
            }

Очень хотел заюзать эту библиотеку в проекте, но что-то не всё однозначно. Предыдущая версия позволяет делать что-то что я хочу, но не работают другие примеры из документации.

версия 0.14

Answer 1

[vintage]

Почему бы не спросить это у автора библиотеки? angularlight.org/community.html

Answer 2

[lega]

При изменении содержимого объекта сам объект не меняется (поэтому не происходит вызова фильтра), в этом случае нужно использовать глубокое отслеживание (deep watch), который для аргументов фильтра не поддерживается.
Но можно сделать фильтр на низком уровне, где можно добавить любое отслеживание: https://jsfiddle.net/lega911/qbku6a57/

Этот вариант проще, https://jsfiddle.net/lega911/t1awuju4/
но функция вызывается на каждый digest цикл, можно использовать для маленьких компонентов/приложений

Так, если использовать стандартный фильтр: https://jsfiddle.net/lega911/30286ncd/

Comments

[lega]

Ещё такой вариант https://jsfiddle.net/lega911/2d9mnmLk/
сам фильтр лужит в scope

[Александр Карпов]

lega, Спасибо большое!