angularjs-directive- все статьи тега


AngularJS передает параметры в шаблоне директивы контроллеру

В моем приложении у меня есть такие директивы: .directive('nodeList', function($compile) { return { restrict: 'E', terminal: true, scope: { nodes: '=ngModel', deleteArticle: '&', editArticle: '&' }, link: function ($scope, $element, $attrs) { if (angular.isArray($scope.nodes)) { $element.append('<accordion close-others="true"><node ng-repeat="item in nodes" ng-model="ite ...

Компиляция динамического HTML и привязка переменной из JSON response - директивы с изолированной областью видимости-AngularJS

Мне нужно отрисовать динамический шаблон из базы данных, а также привязать переменные к выражениям. Мой ответ JSON будет выглядеть так, [{ "htmlTemplate": "<div>{{name}}</div><div>{{age}}</div>", "bindData": { "name": "safeer", "age" : "25" } }, { "htmlTemplate": "<span>{{name}}</span><div>{{address}}</div>", "bindData": { "name": "john", "address":"qwerty" } }, { "htmlTemplate": "<h ...

Как использовать событие нажатия клавиши в AngularJS?

Я хочу поймать событие нажатия клавиши enter в текстовом поле ниже. Чтобы сделать его более ясным, я использую ng-repeat для заполнения элемента tbody. Вот HTML: <td><input type="number" id="closeqty{{$index}}" class="pagination-right closefield" data-ng-model="closeqtymodel" data-ng-change="change($index)" required placeholder="{{item.closeMeasure}}" /></td> Это мой модуль: angular.module('components', ['ngResource']); Я использую ресурс для заполнения таблицы и мо ...

Как установить bootstrap navbar active class с Angular JS?

если у меня есть navbar в bootstrap с элементами Home | About | Contact Как установить активный класс для каждого пункта меню, когда они активные? То есть, как я могу установить class="active" когда угловой маршрут находится в #/ для дома #/about на странице #/contact на странице ...

Как я могу динамически добавить директиву в AngularJS?

у меня есть очень урезанная версия того, что я делаю, которая решает проблему. у меня простой directive. Всякий раз, когда вы нажимаете на элемент, он добавляет еще один. Однако сначала он должен быть скомпилирован, чтобы правильно его отобразить. мои исследования привели меня к $compile. Но все примеры используют сложную структуру, которую я действительно не знаю, как применить здесь. скрипки здесь: http://jsfiddle.net/paulocoelho/fBjbP/1/ и JS здесь: var module = angular.module('testApp', ...

Как установить атрибут iframe src из переменной в AngularJS

Я пытаюсь установить src атрибут iframe из переменной, и я не могу заставить его работать... разметка: <div class="col-xs-12" ng-controller="AppCtrl"> <ul class=""> <li ng-repeat="project in projects"> <a ng-click="setProject(project.id)" href="">{{project.url}}</a> </li> </ul> <iframe ng-src="{{trustSrc(currentProject.url)}}"> Something wrong... </iframe> </div> контроллеры/при ...

Добавить директив директивы в AngularJS

Я пытаюсь создать директиву, которая заботится о добавление директивы к элементу, на котором он объявлен. Например, я хочу построить директиву, которая заботится о добавлении datepicker,datepicker-language и ng-required="true". если я пытаюсь добавить эти атрибуты, а затем использовать $compile Я, очевидно, создать бесконечный цикл, поэтому я проверяю, если я уже добавил необходимые атрибуты: angular.module('app') .directive('superDirective', function ($compile, $injector) { return { ...

Выделите текст на Фокусе ввода

у меня есть ввод текста. Когда вход получает фокус, я хочу выделить текст внутри входа. С jQuery я бы сделал это так: <input type="text" value="test" /> $("input[type=text]").click(function() { $(this).select(); // would select "test" in this example }); Я искал вокруг, чтобы попытаться найти угловой способ, но большинство примеров, которые я нахожу, имеют дело с директивой, которая наблюдает за модальным свойством для изменения. Я предполагаю, что мне нужна директива, кото ...

Использование символов '@', '&', '=' и ' > ' в привязке области действия пользовательской директивы: AngularJS

Я много читал об использовании этих символов в реализации пользовательских директив в AngularJS, но концепция все еще не ясна мне. Я имею в виду, что это значит, если я использую одно из значений в пользовательской директиве? var mainApp = angular.module("mainApp", []); mainApp.directive('modalView',function(){ return{ restrict:'E', scope:'@' OR scope:'&' OR scope:'=' OR scope:'>' OR scope:true } }); что именно мы делаем с размахом здесь? Я тоже не уверен ...

директива angularjs вызывает функцию, указанную в атрибуте, и передает ей аргумент

Я хочу создать директиву, которая ссылается на атрибут. Атрибут определяет функцию, которая должна быть вызвана в области видимости. Но я также хочу передать аргумент функции, которая определена внутри функции link. <div my-method='theMethodToBeCalled'></div> в функции link я привязываюсь к событию jQuery, которое передает аргумент, который мне нужно передать в функцию: app.directive("myMethod",function($parse) { restrict:'A', link:function(scope,element,attrs) { var exp ...

Как модульное тестирование изолированной области директивы в AngularJS

что такое хороший способ модульного тестирования изолированной области в AngularJS JSFiddle показывает модульный тест директива фрагмент scope: {name: '=myGreet'}, link: function (scope, element, attrs) { //show the initial state greet(element, scope[attrs.myGreet]); //listen for changes in the model scope.$watch(attrs.myGreet, function (name) { greet(element, name); }); } Я хочу убедиться, что директива прослушивает изменения ...

Для тестирования пользовательской проверки в AngularJS директивы

эта пользовательская директива проверки является примером, представленным на официальном сайте angular. http://docs.angularjs.org/guide/forms Он проверяет ввод текста в числовом формате или нет. var INTEGER_REGEXP = /^-?d*$/; app.directive('integer', function() { return { require: 'ngModel', link: function(scope, elm, attrs, ctrl) { ctrl.$parsers.unshift(function(viewValue) { if (INTEGER_REGEXP.test(viewValue)) { // it is valid ctrl.$setValidity('in ...

Как ограничить ввод только цифрами?

Я использую ngChange в AngularJS, чтобы вызвать пользовательскую функцию, которая удалит любые буквы, которые пользователь добавляет на вход. <input type="text" name="inputName" data-ng-change="numbersOnly()"/> проблема в том, что мне нужно нацелиться на вход, который вызвал numbersOnly() Так что я могу удалить введенные буквы. Я долго и упорно смотрел на Google и не смог найти ничего по этому поводу. что я могу сделать? ...

вызов метода родительского контроллера из директивы в AngularJS

после моего предыдущего вопроса, я теперь пытаюсь вызвать метод на родительском контроллере из моей директивы. Я получаю неопределенный параметр. Вот что я делаю: <body ng-app="myApp" ng-controller="MainCtrl"> <span>{{mandat.rum}}</span> <span>{{mandat.surname}}</span> <input type="text" ng-model="mandat.person.firstname" /> <my-directive mandate-person="mandat.person" updateparent="updatePerson()" > </my-directive> </body> и скрипт ...

AngularJS доступ к элементам DOM внутри шаблона директивы

есть ли более "угловой" способ выбора элементов DOM внутри шаблона директивы? Например, скажем, у вас есть эта директива: app.directive("myDirective", function() { return { template: '<div><ul><li ng-repeat="item in items"></ul></div>', link: function(scope, element, attrs) { var list = element.find("ul"); } } }); я использовал селектор стиля jQuery, чтобы получить доступ к DOM <ul> элемент, отображаемый в моем ша ...

Директивы в AngularJS не обновляет на область изменения переменных

Я попытался написать небольшую директиву, чтобы обернуть ее содержимое с другим файлом шаблона. этот код: <layout name="Default">My cool content</layout> должен иметь этот вывод: <div class="layoutDefault">My cool content</div> потому, что макет "по умолчанию" этот код: <div class="layoutDefault">{{content}}</div> вот код директивы: app.directive('layout', function($http, $compile){ return { restrict: 'E', link: function(scope, element, attr ...

Включить подсказку angular-ui для пользовательских событий

Я пытаюсь использовать функцию подсказки angular-ui, чтобы показать моему пользователю, что определенное поле недопустимо, но кажется, что подсказка может быть показана только на некоторых предопределенных триггерах. Есть ли способ, с помощью которого я могу вызвать подсказку, кроме этих триггеров? например: <input type="text" tooltip="Invalid name!" tooltip-position="right" tooltip-trigger="myForm.username.$invalid"> ...

Указание директивы templateUrl относительно root

в настоящее время я заявляю templateUrl относительно текущего местоположения окна. cvApp.directive('personalDetails', function () { return { restrict: 'A', templateUrl: '../../Scripts/app/templates/personalDetails.html' }; }); Как я могу сделать templateUrl относительно корня приложения? Я ищу что-то вроде этого: templateUrl: '~/Scripts/app/templates/personalDetails.html' может ли AngularJS выполнить это? ...

Как разрешить только число (цифры и десятичная точка) для ввода во вход?

Я новичок в angularjs. Мне интересно, как можно разрешить только допустимое число, введенное в текстовое поле. Например, пользователь может ввести "1.25", но не может ввести " 1.A" или "1..". При попытке пользователя ввести следующий символ, который сделает его инвалидом, он не может ввести его. спасибо заранее. ...

Установить фокус на первый недопустимых входных данных на AngularJS форма

Я прочитал несколько статей и вопросов StackOverflow, связанных с настройкой фокуса в AngularJs. к сожалению, все примеры, которые я прочитал, предполагают, что есть некоторый атрибут, который я могу добавить к элементу, чтобы получить фокус, например директиву focusMe. однако что делать, если я заранее не знаю, на какой вход установить фокус? В частности, как установить фокус на первый элемент ввода в форме ,которая имеет $ invalid set-т. е. элемент, который терпит неудачу утверждение. Там м ...