угловая директива форматирования/парсера ввода и интерполированные атрибуты?

Я пытаюсь написать настраиваемую директиву, которая применяется к элементу ввода, для которого требуется ngModel и которая добавляет синтаксический анализатор и функцию форматирования для ngModel.

Проблема, с которой я сталкиваюсь, заключается в том, что я не могу передать интерполированные значения в директиву, одновременно поддерживая привязку ngModel. Например, я хочу иметь возможность использовать мою директиву одним из двух способов:

передача буквальных аргументов:

<input ng-model="foo" my-directive="120" />

или передавая интерполированные аргументы из текущей области:

<input ng-model="foo" my-directive="{{bar}}" />

...
function MyCtrl($scope) {
  $scope.bar = "120";
}

Если я прочитаю аргумент атрибутов функции ссылки в своем определении директивы, я могу получить значение attribute.myDirective при первом использовании, но при втором использовании значение myDirective не определено.

Теперь, если я добавлю изолированную область действия в определение директивы:

scope: { myDirective: '@' }

Затем определяется и интерполируется scope.myDirective в приведенных выше сценариях, но теперь ngModel не работает. Мои функции парсера/форматера передаются неопределенными для их входных аргументов. Что происходит и как я могу реализовать желаемое поведение?

директива:

module.directive('myDirective', function () {
        return {
            restrict: 'A',
            require: 'ngModel',
            replace: false,
            link: function (scope, elm, attrs, ctrl) { // attrs.myDirective not interpolated

person Jeremy Bell    schedule 15.02.2013    source источник
comment
Можете ли вы опубликовать код для вашей директивы? Я подозреваю, что вы, возможно, не используете ключ require, который даст вам доступ к контроллеру ngModel.   -  person satchmorun    schedule 15.02.2013


Ответы (1)


Когда вы добавляете изолированную область, вы создаете совершенно новую дочернюю область, которая не наследуется от области со значением ngModel в ней. Вот почему ваши парсеры и средства форматирования становятся неопределенными.

Кроме того, в вашем примере, чтобы получить значение bar, вам не нужны фигурные скобки:

<input ng-model='foo' my-directive='bar' />

И в вашей функции связывания:

link: function(scope, element, attr, ctrl) {
  attr.myDirective == 'bar'.
  scope.$eval(attr.myDirective) == // whatever the value of 'bar' is in the current scope
}

Таким образом, вам не нужна изолированная область. Просто используйте scope.$eval для оценки выражения, переданного вашей директиве.

Вот небольшая скрипка.

person satchmorun    schedule 15.02.2013