Member 12906141 Ответов: 2

Как создать директиву datepicker в angular?


Я пытаюсь ухватить пользовательскую директиву Angular глубоко.

С помощью какого-то онлайн-поста я получил базовое представление о синтаксисе. Я много слышал о директиве datepicker.

Так может ли кто-нибудь, пожалуйста, опубликовать пример угловой директивы datepicker шаг за шагом?

Пожалуйста, ответьте на эти вопросы вместе с ним:-

1)Что такое использование атрибута require?

2) Когда я должен использовать "А", " Е " для опции ограничения?(Для ex datepicker)

3)в чем разница между функцией compile &link?

Что я уже пробовал:

app.directive('datetimepicker', function () {
return {
    restrict : 'AE',
    require :'ngModel',
    link : function(scope,ele, attr){}
    });

2 Ответов

Рейтинг:
1

David_Wimbley

Цитата:
1)Что такое использование атрибута require?

Атрибут require попытается получить доступ к другой директиве, называемой (в вашем случае) ngModel.

Цитата:
2) Когда я должен использовать "А", " Е " для опции ограничения?(Для ex datepicker)

Это ограничивает использование директивы your конкретным методом ее использования.

Атрибут. Что-то вроде &ЛТ;Спан datetimepicker для=""&ГТ;&ЛТ;/службы&ГТ;
E = Элемент. Так что что-то вроде & lt;datetimepicker>
C-класс. Что-то вроде &ЛТ;промежуток класс="элемент datetimepicker"&ГТ;&ЛТ;/службы&ГТ;
M = Комментарий. Так что это будет что-то вроде <!--directive:datetimepicker-->

Я не думаю, что вы можете использовать оба AE для создания режиссуры, но я не уверен в этом на 100%.

Цитата:
3)в чем разница между функцией compile &link?


Для этого я бы направил вас по этой ссылке для объяснения: javascript - в чем разница между функцией компиляции и связью в angularjs - Stack Overflow[^]

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

Вот некоторые многообещающие ссылки:

в AngularJS-элемент управления datepicker[^]

javascript - AngularJS custom datepicker директива-переполнение стека[^]

Гитхаб - g00fy-/угловая-элемент управления datepicker: календарь и отмечать директив в угловой[^]

[Материал Угловой Js-DatePicker]

Я также рекомендую вам взглянуть на директивную документацию для angular:

[Угловая директива JS]


Member 12906141

Спасибо, Дэвид. Но не могли бы вы, пожалуйста, завершить свой Анс, как кажется, левой половиной. [Атрибут. Так что-то вроде ???]

David_Wimbley

Я исправил кодировку html, забыл об этом.

Рейтинг:
1

pankaj287

Вы можете просто рассмотреть возможность использования компонента` ui-bootstrap `plugin` datepicker'. Он имеет простой синтаксис uib-datepicker. UI-bootstrap также преобразовал почти весь компонент bootstrap в его ангуляризованную версию.

<div uib-datepicker ng-model="dt"></div>