Угловые атрибуты по директивам

Question

Угловые атрибуты по директивам

0

Я не понимаю, что делает этот атрибут в этом случае:

<div my-custom-directive="what does this do?"></div>

Пример реального мира:

 <div class="grid" ui-grid="gridOptionsSimple"> </div>

Это не значит передавать атрибуты функции связывания, потому что вы можете сделать это следующим образом:

<div my-custom-attribute="what does this do?" extra-attribute="123"></div>

Похоже, что он создает свойство в области видимости. Но это, насколько я знаю. Сожалею. Совсем новичок вопрос.

c0bra 02 июль 2015, в 21:01

Источник

Теги:

angularjs

angularjs-directive

2 ответа

0

Вот пример, я думаю, ваш вопрос:

var app = angular.module('demo',[]);

app.directive('SampleQuilt', function() {
        return {
            restrict: 'E',
            scope:{ extraAttribute: "@", someText: "@"  }
            };
  });

Добавляя область действия к директиве, мы создаем "изолированную область". С помощью этого подхода область охвата может захватывать атрибуты тремя способами:

@ Записывает значение атрибута из DOM как строковое значение.
= Оценивает атрибут как свойство родительской области.
& Оценивает атрибут как метод родительской области.

Вы можете прочитать больше об этом здесь:

http://onehungrymind.com/angularjs-sticky-notes-pt-2-isolated-scope/

Что касается вашего html:

Случаи (случай верблюда или паскаль) означают тире в угловых директивах, поэтому sampleText следует использовать в качестве sample-text в html.

Dalorzo 02 июль 2015, в 16:22

0

Хорошо, вы были быстрее;) Возможно, добавьте пример функции ссылки, чтобы показать, как получить доступ к этим вещам в области видимости, и объяснить разницу между scope и attrs .
Sebastian S 02 июль 2015, в 18:34

Ещё вопросы

Хорошо, вы были быстрее;) Возможно, добавьте пример функции ссылки, чтобы показать, как получить доступ к этим вещам в области видимости, и объяснить разницу между scope и attrs .

c0bra · Accepted Answer · 2015-07-02T16-57-00.000Z

В случае ui-grid="gridOptionsSimple" он передает значение gridOptionsSimple в родительской области в область выделения сетки ui-.

Если вы посмотрите источник для директивы grid ui- (здесь: https://github.com/angular-ui/ng-grid/blob/v3.0.0-rc.22/src/js/core/directives/ui- grid.js # L196) вы увидите, что в директиве указывается, что uiGrid области uiGrid ("ui- в змеином случае) привязано к uiGrid ('=' просто коротко для ' = uiGrid ').

return {
  templateUrl: 'ui-grid/ui-grid',
  scope: {
    uiGrid: '='
  },
  replace: true,
  transclude: true,
  ...
};

Это позволяет сетке получать все параметры и ссылки на данные в свою область действия без необходимости использования грязных и родительских контроллеров.

Спасибо, c0bra. Часть, которая ускользает от меня, объясняется тем, что "= просто сокращенно для = uiGrid". Это особый случай. Если имя свойства изолированной области совпадает с именем атрибута, вы можете просто использовать «=». Этот ярлык означает, что если ваше свойство изолированного контекста имеет то же имя, что и директива, вам не нужны никакие другие атрибуты, а cas просто используйте «=». Я должен был сделать скрипку, чтобы решить это. jsfiddle.net/justinwyllie/0haj72ag