Here's a directive I created:
HTML:
<p-test something="'bla'"></p-test>
JavaScript:
.directive('pTest', function() {
return {
scope: {
something: '=?'
},
templateUrl: 'components/testTemplate.html',
controller: 'testController'
};
});
I'd like to be able to pass 'bla' as a string without the '', in the following way:
<p-test something="bla"></p-test>
I know it's possible via the attributes parameter in link, but it's irrelevant in this case (correct me if I'm wrong) as I'm passing these parameters directly to scope.
Note: When you create a directive, it is restricted to attribute and elements only by default. In order to create directives that are triggered by class name, you need to use the restrict option. The restrict option is typically set to: 'A' - only matches attribute name. 'E' - only matches element name.
Using attrs you are able to access the attributes defined in your html tag like <fm-rating ng-model="$parent.restaurant.price" symbol="$" readonly="true"> So in this case you will have access to the symbol and readonly attributes.
Create New Directives In addition to all the built-in AngularJS directives, you can create your own directives. New directives are created by using the . directive function. To invoke the new directive, make an HTML element with the same tag name as the new directive.
I'd like to be able to pass 'bla' as a string without the '', in the following way:
You would just need text binding (@
) binding for that, instead of 2 way binding.
.directive('pTest', function() {
return {
scope: {
something: '@?' //<-- Here
},
templateUrl: 'components/testTemplate.html',
controller: 'testController'
};
});
and with the text binding if you want to bind scope properties then use interpolation. i.e example if bla is a scope variable holding a string then just do:
<p-test something="{{bla}}"></p-test>
Plnkr
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