angularjs-directive

Uncaught ReferenceError: angular is not defined - AngularJS not working

两盒软妹~` 提交于 2019-12-28 05:35:10
问题 I'm attempting to learn angular and I am struggling with a simple button click. I followed an example which has an identical code to the one below. The result I am looking for is for the button click to cause an alert. However, there is no response to the button click. Does anybody have any ideas? <html lang="en" ng-app="myApp" > <head> <meta charset="utf-8"> <title>My AngularJS App</title> <link rel="stylesheet" href="css/app.css"/> </head> <body> <div > <button my-directive>Click Me!<

How to detect browser using angularjs?

这一生的挚爱 提交于 2019-12-28 03:30:13
问题 I am new to angularjs. How can I detect userAgent in angularjs. Is it possible to use that in controller? Tried something like below but no luck! var browserVersion = int((/msie (\d+)/.exec(lowercase(navigator.userAgent)) || [])[1]); I need to detect IE9 specifically! 回答1: Like Eliran Malka asked, why do you need to check for IE 9? Detecting browser make and version is generally a bad smell. This generally means that you there is a bigger problem with the code if you need JavaScript to detect

AngularJS directive binding a function with multiple arguments

ぐ巨炮叔叔 提交于 2019-12-28 03:29:05
问题 I'm having some trouble binding a function defined in a controller with a callback function in a directive. My code looks like the following: In my controller: $scope.handleDrop = function ( elementId, file ) { console.log( 'handleDrop called' ); } Then my directive: .directive( 'myDirective', function () { return { scope: { onDrop: '&' }, link: function(scope, elem, attrs) { var myFile, elemId = [...] scope.onDrop(elemId, myFile); } } ); And in my html page: <my-directive on-drop="handleDrop

How to understand the `terminal` of directive?

耗尽温柔 提交于 2019-12-27 16:40:29
问题 In this page: http://docs.angularjs.org/guide/directive Directive Definition Object terminal If set to true then the current priority will be the last set of directives which will execute (any directives at the current priority will still execute as the order of execution on same priority is undefined). I don't understand it well. What does current priority mean? If there are such directives: directive1 with { priority: 1, terminal: false} directive2 with { priority: 10, terminal: false}

How to understand the `terminal` of directive?

十年热恋 提交于 2019-12-27 16:40:26
问题 In this page: http://docs.angularjs.org/guide/directive Directive Definition Object terminal If set to true then the current priority will be the last set of directives which will execute (any directives at the current priority will still execute as the order of execution on same priority is undefined). I don't understand it well. What does current priority mean? If there are such directives: directive1 with { priority: 1, terminal: false} directive2 with { priority: 10, terminal: false}

Accessing attributes from an AngularJS directive

百般思念 提交于 2019-12-27 16:39:31
问题 My AngularJS template contains some custom HTML syntax like: <su-label tooltip="{{field.su_documentation}}">{{field.su_name}}</su-label> I created a directive to process it: .directive('suLabel', function() { return { restrict: 'E', replace: true, transclude: true, scope: { title: '@tooltip' }, template: '<label><a href="#" rel="tooltip" title="{{title}}" data-placement="right" ng-transclude></a></label>', link: function(scope, element, attrs) { if (attrs.tooltip) { element.addClass('tooltip

calling method of parent controller from a directive in AngularJS

吃可爱长大的小学妹 提交于 2019-12-27 13:35:46
问题 Following my previous question, I'm now trying to call a method on the parent controller from my directive. I get an undefined parameter. Here's what I do: <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> And the script: var app = angular.module('myApp', []); app.controller(

To test a custom validation angularjs directive

孤街醉人 提交于 2019-12-27 11:55:28
问题 This custom validation directive is an example presented at the official angular site. http://docs.angularjs.org/guide/forms It checks a text input is in number format or not. 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('integer', true); return viewValue; } else { // it is invalid,

To test a custom validation angularjs directive

风格不统一 提交于 2019-12-27 11:54:28
问题 This custom validation directive is an example presented at the official angular site. http://docs.angularjs.org/guide/forms It checks a text input is in number format or not. 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('integer', true); return viewValue; } else { // it is invalid,

Angularjs loading screen on ajax request

老子叫甜甜 提交于 2019-12-27 11:37:07
问题 Using Angularjs , I need to show a loading screen (a simple spinner) until ajax request is complete. Please suggest any idea with a code snippet. 回答1: Instead of setting up a scope variable to indicate data loading status, it is better to have a directive does everything for you: angular.module('directive.loading', []) .directive('loading', ['$http' ,function ($http) { return { restrict: 'A', link: function (scope, elm, attrs) { scope.isLoading = function () { return $http.pendingRequests