Angularjs необходимо обновить модель перед изменением

Question

Angularjs необходимо обновить модель перед изменением

0

Я создаю customdirective и хочу обновить ng-модель перед ng-change fire. В настоящее время ng-change fire перед значением udpate ng-mdoel ниже - это мой код.

Основная проблема возникает, когда я изменяю номер страницы в выпадающем списке. Он предупреждает о предыдущем значении. Я думаю, что обновление ng-mdoel после ng-change fire. но я хочу, чтобы ng-model fire перед ng-change.

app.directive('bottomPagination', function () {
    var directive = {
        templateUrl: '/App/Common/directives/bottomPagination.html',
        restrict: 'A',
        replace: true,
        scope: {
            currentPage: '=',
            changePageSize: '&'
        }
    };
    return directive;
});

//here is html directive (/App/Common/directives/bottomPagination.html)

       <select  id="pagesizeddl" ng-model="pageSize" ng-change="changePageSize()">
                            <option>5</option>
                            <option>10</option>
                            <option>20</option>
                            <option>30</option>
                        </select>

// here is my html page where i used directive


<div data-ng-controller="ProductsList as vm">
                <div data-bottom-pagination
                        data-page-size="vm.paging.pageSize"
                        data-change-page-size="vm.changePageSize()"
                         >
                    </div>
  </div>

// This is contrller
(function () {
    // Start Products List function
    var ListControllerId = 'ProductsList';
    angular.module('app').controller(ListControllerId,
        ['$scope', ListController]);

    function ListController($scope) {
        var vm = this;

        vm.paging = {
            pageSize: 10
        }; 

        vm.changePageSize = changePageSize;

        function changePageSize() {
            alert(vm.paging.pageSize);
        }
    }
})();

Karan Kumar 19 апр. 2016, в 20:50

Источник

1

Вы можете просто сделать $watch на pageSize а затем вызвать changePageSize в этом ...
Heretic Monkey 19 апр. 2016, в 18:00
0

Из документов: «Выражение ngChange оценивается только тогда, когда изменение входного значения приводит к тому, что новое значение будет зафиксировано в модели». docs.angularjs.org/api/ng/directive/ngChange Вы можете проверить метод, который вы вызываете с помощью ng-change чтобы увидеть, пытаетесь ли вы вручную обновить связанную модель.
Chaim Eliyah 19 апр. 2016, в 18:01
0

@MikeMcCaughan Пожалуйста, пришлите мне правильный код. Это поможет мне.
Karan Kumar 19 апр. 2016, в 18:05
0

Я уверен, что это будет, но это не поможет никому другому. Пожалуйста, поищите в интернете информацию о $watch и о том, как это работает. Попробуй что-нибудь . Затем, если у вас есть проблемы с тем, что вы пробовали, и вы не можете найти ответ в документации или в сотнях учебных пособий, вернитесь и спросите.
Heretic Monkey 19 апр. 2016, в 18:08

Показать ещё 2 комментария

Теги:

javascript

angularjs

1 ответ

Ещё вопросы

Вы можете просто сделать $watch на pageSize а затем вызвать changePageSize в этом ...
Из документов: «Выражение ngChange оценивается только тогда, когда изменение входного значения приводит к тому, что новое значение будет зафиксировано в модели». docs.angularjs.org/api/ng/directive/ngChange Вы можете проверить метод, который вы вызываете с помощью ng-change чтобы увидеть, пытаетесь ли вы вручную обновить связанную модель.
@MikeMcCaughan Пожалуйста, пришлите мне правильный код. Это поможет мне.
Я уверен, что это будет, но это не поможет никому другому. Пожалуйста, поищите в интернете информацию о $watch и о том, как это работает. Попробуй что-нибудь . Затем, если у вас есть проблемы с тем, что вы пробовали, и вы не можете найти ответ в документации или в сотнях учебных пособий, вернитесь и спросите.

walki12 · Accepted Answer · 2016-04-19T15-37-00.000Z

Привет, у меня была такая же проблема.

Решением моей лучшей практики является добавление параметра в функцию ng-change в шаблон вашей директивы. Вам нужно добавить параметр как объект JSON!

<select  id="pagesizeddl" ng-model="pageSize" ng-change="changePageSize({pageSize:pageSize})">
                        <option>5</option>
                        <option>10</option>
                        <option>20</option>
                        <option>30</option>
                    </select>

Свойство "pageSize" (объекта JSON) будет сопоставляться с параметром вашей директивной функции vm.changePageSize(pageSize). Поэтому необходимо, чтобы у обоих было одно и то же имя!

<div data-ng-controller="ProductsList as vm">
            <div data-bottom-pagination
                    data-page-size="vm.paging.pageSize"
                    data-change-page-size="vm.changePageSize(pageSize)"
                     >
                </div>

Теперь вам нужно только изменить функцию контроллера следующим образом:

function changePageSize(pageSize) {
        alert(pageSize);
    }