Menu
On the this plunker you can notice a strange behavior with the attribute name's pattern data-* in a directive.
The call :
<body ng-app="apptest" ng-controller="Controller">
Test of data named attribute :
<br/>
<directivetest data-test="vartest" test="vartest" another-test="vartest"></directivetest>
</body>
of the directive :
angular.module('apptest', [])
.controller('Controller', ['$scope',
function($scope) {
$scope.vartest = "This is a test";
}
])
.directive('directivetest', function() {
return {
restrict: 'E',
scope: {
dataTest: '=',
test: '=',
anotherTest: '='
},
templateUrl: "directive.html"
}
});
will take all the attributes of directivetest into account but data-test and therefore display :
Test of data named attribute : Attribute with data-* name : Attribute with regular name : This is a test Attribute with an other regular name : This is a test
I am wondering why this happens (I wasted 4 hours before I figured out that it was the issue).
It seems to be impossible to name a directive data-*, why is that?
I read something about it here http://www.w3schools.com/tags/att_global_data.asp, is it why my attribute is undefined? It is simply not read by the browser?
947
It is tempting to do too much work in the AngularJS controller. After all, the controller is where the view first has access to JavaScript via $scope functions. However, doing this will cause you to miss out on code sharing across the site and is not recommended by AngularJS documentation.
Explaination. ng-state is not an AngularJS directive. Q 15 - Which of the following is true about ng-app directive? A - ng-app directive defines and links an AngularJS application to HTML.
Restrict. Angular allows us to set a property named restrict on the object we return on our directive definition. We can pass through a string with certain letters letting Angular know how our directive can be used. function MyDirective() { return { restrict: 'E', template: '<div>Hello world!
Overview. Compiles an HTML string or DOM into a template and produces a template function, which can then be used to link scope and the template together. The compilation is a process of walking the DOM tree and matching DOM elements to directives.
The data- prefixed forms of directive names allow HTML validators to work because custom data attributes in HTML5 follow that form. AngularJS directive names are normalized as follows to support custom data attributes:
The normalization process is as follows:
- Strip
x-anddata-from the front of the element/attributes.- Convert the
:,-, or_-delimited name to camelCase.
178
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
