Uib-paginator - одноразовая привязка

Введение

Теперь я использую uib-paginator в своем приложении Angular 1.6. Я хочу иметь возможность изменять некоторые привязки после запуска приложения. Например. в этом случае я хочу изменить язык в любое время.

Похоже, что некоторые привязки директив uib-paginator используют одноразовую привязку. Так что я могу повлиять на них только один раз.

Использование

<ul uib-pagination total-items="3"
    ng-model="currentPage"
    class="Pagination"
    boundary-links="true"
    num-pages="numPages"
    items-per-page="itemsPerPage"
    first-text="{{'LABEL_FIRST' | translate}}"
    next-text="{{'LABEL_NEXT' | translate}}"
    previous-text="{{'LABEL_PREV' | translate}}"
    last-text="{{'LABEL_LAST'}} | translate"></ul>
  • These bindings use one-time binding:
    • first-text
    • следующий текст
    • предыдущий текст
    • последний текст

Когда я меняю язык, значения переменных LABEL_* изменятся. Но, очевидно, это не влияет на paginator.

Мысли

Вероятно, я мог бы написать код jQuery для обновления этого конкретного элемента при изменении любой из этих переменных LABEL_*. Но я хочу держать jQuery подальше от этого приложения, насколько это возможно.

Если у вас есть идея, как я могу решить эту проблему (без jQuery.. :), поделитесь ею.


angularjs angular-translate angular-ui-bootstrap
person Pétur Haukur Jóhannesson    schedule 06.03.2017    source источник
comment
Не могли бы вы показать или описать метод перевода меток? Я думаю, что вам, вероятно, придется использовать фильтр, чтобы сделать это...   -  person The.Bear    schedule 07.03.2017
comment
Я забыл добавить фильтр перевода в примере выше. Но это не имеет значения. Это все еще не работает. first-text="{{'LABEL_FIRST' | translate}}" next-text="{{'LABEL_NEXT' | translate}}" previous-text="{{'LABEL_PREV' | translate}}" last-text="{{'LABEL_LAST' | translate}}" И перевод работает везде на этой странице, кроме этой директивы paginator.   -  person Pétur Haukur Jóhannesson    schedule 07.03.2017
comment
Вы используете angulari18n или пользовательскую библиотеку перевода?   -  person The.Bear    schedule 07.03.2017
comment
Я использую angular-translate github.com/angular-translate/angular-translate< /а>   -  person Pétur Haukur Jóhannesson    schedule 08.03.2017
comment
Если вы видите код uib-pagination (строка 131) вы можете проверить, что метки имеют только одностороннюю привязку данных... Я думаю, что было бы слишком сложно менять метки на лету. Это должно быть сделано хакерским способом....   -  person The.Bear    schedule 09.03.2017
comment
Я создал jsFiddle с вашей проблемой... используйте его для своего вопроса, если вы хочу. Надеюсь, кто-нибудь найдет решение :)   -  person The.Bear    schedule 09.03.2017
comment
Спасибо, Медведь :) Наконец-то я нашел решение и опубликую его ниже.   -  person Pétur Haukur Jóhannesson    schedule 09.03.2017

Ответы (1)


arrow_upward
1
arrow_downward

Вот решение для тех, у кого такая же проблема:

1.
Это шаблон uib-paginator:
https://github.com/angular-ui/bootstrap/blob/master/template/pagination/pagination.html

Скопируйте его в файл .html.

2.
Изменить все

{{::getText('x')}} to {{getText('x')}}

Или замените его собственным переводом (как это сделал я)

{{::getText('first')}} to {{'LABEL_FIRST'|translate}}

3.
Используйте атрибут template-url в разбиении на страницы uib и ссылку на новый шаблон.

Новый пример моего кода выше будет выглядеть так:

<ul uib-pagination total-items="3"
ng-model="currentPage"
class="Pagination"
boundary-links="true"
num-pages="numPages"
items-per-page="itemsPerPage"
template-url="../templates/myNewPaginatorTemplate.html"></ul>

Вуаля.

person Pétur Haukur Jóhannesson    schedule 09.03.2017