directive

问题 Whenever I use a directive within itself, the page freezes, and eats up more and more CPU and RAM until the tab hangs. What I have is this Application.Directives.directive('somed', function() { return { restrict: 'E', // Load the template from a separate HTML file templateUrl: 'directives/somed/view.html', replace: true }; }); and template like <div ng-if="nonexistent"> <somed></somed> </div> Which should never load the nested directive (the ng-if evaluates to false, so no content is shown.

问题 I want to know about the difference between these two lines. <p [myHighlight]="'yellow'">Highlighted in yellow</p> <p myHighlight="orange">Highlighted in orange</p> myHighlight is custom directive where all tags inside it will be set custom color. Thanks. 回答1: Have a read of this page on the angular docs it will tell you all about the template syntax. But simply the top row will be evaluated as an expression and the line below as a constant. Quoted from the docs. The brackets tell Angular to

问题 like the title says, I'm attempting to make an attribute directive that wraps its parent and allows me to toggle between editing and showing the actual model value.. In short: <input ng-model="model" allow-edit="editing" /> Would end up looking like: <div> <div ng-hide="editing">{{model}}</div> <input ng-show="editing" ng-model="model"></input> </div> If everything went right. However, I keep on getting something more along the lines of: <input ng-model="model"> <!-- html from allow-edit

问题 like the title says, I'm attempting to make an attribute directive that wraps its parent and allows me to toggle between editing and showing the actual model value.. In short: <input ng-model="model" allow-edit="editing" /> Would end up looking like: <div> <div ng-hide="editing">{{model}}</div> <input ng-show="editing" ng-model="model"></input> </div> If everything went right. However, I keep on getting something more along the lines of: <input ng-model="model"> <!-- html from allow-edit

问题 I want to know how I might manually obtain the attribute from the linkFn call back. e.g. if I want scope, I do, angular.element(element).scope() controller angular.element(element).controller('ngModel') how about for attr. 回答1: In the parent controller I suppose you could access the attributes object after first assigning it to a scope property in the directive: <div ng-controller="MyCtrl"> <div my-directive attr1="one">see console log</div> </div> app.directive('myDirective', function() {

问题 I am writing my angularjs directive with definition like: return { restrict: 'EA', link: link, scope: true, transclude: true, replace: true, controller: controller, template: '<div class="wizard">' + '<div ng-transclude></div>' + '</div>' }; I notice two scopes was created: < Scope (003) --- parent scope of directive < Scope (004) --- controller scope of directive which I think is child scope created by 'scope=true'. all my functions, properites defined in controller show up in this scope <

问题 I am using the direct following and I do not detect the copy and paste with the keys inside the input, would someone know how? Thank you! export class OnlyNumberDirective { // Allow decimal numbers. The \, is only allowed once to occur private regex: RegExp = new RegExp(/[0-9]+(\,[0-9]{0,1}){0,1}$/g); // Allow key codes for special events. Reflect : // Backspace, tab, end, home private specialKeys: Array<string> = [ 'Backspace', 'Tab', 'End', 'Home', 'Delete', 'Del', 'Ctrl', 'ArrowLeft',

问题 Usage: <my-directive my-var="true"></my-directive> Directive: app.directive('myDirective', [ function () { var definition = { restrict: "E", replace: false, transclude: false, scope: { myVar: '@', }, controller: ['$scope', function($scope) { console.log($scope.myVar); // "true" $scope.myVar = "false"; console.log($scope.myVar); // "false" setTimeout(function() { console.log($scope.myVar); // "true" (!) }, 100); }] }; return definition; } ]); Console output "true" "false" "true" What is

问题 I am having an issue with an Angular2 directive that should do the following: Detect if the user enters '.' character. If the next char is also '.', remove the duplicate '.' and move the cursor position to after the '.' char I have the above working, however, when using this in combination with ngModel, the cursor position jumps to the end every time the model is updated. The input: <input type="text" name="test" [(ngModel)]="testInput" testDirective/> The directive: import {Directive,

问题 I've been able to upgrade an angularjs element directive to be used in angular 4. Here's a sample code: [myScores.js] angular.module('app.components.directives.myScores', []) .directive('myScores', function() { return { scope: { score: '=', }, template: '<div>>>> Your score is {{score}} <<<', link: function(scope) { console.log("in myScores", scope) } }; }); [myScores.ts] import { Directive, ElementRef, Injector, Input, Output, EventEmitter } from '@angular/core'; import { UpgradeComponent }