Angular2 is providing [attr.<attribute name>] to bind attribute values. Here it is

Markup :

Observe below code, role attribute was bound to roleVal 
<div id="divID" [attr.role]="roleVal">
  This text color can be changed by class
</div>

Angular Component Code

Observe below functions addAttr, removeAttr, checkAttr
(function(app) {
  app.AppComponent = ng.core
    .Component({
      selector: 'my-app',
      templateUrl: 'attr1_template.html'
    })
    .Class({
      constructor: function() {
        this.roleVal = '';
      },
      
      addAttr:function() {
        this.roleVal = 'admin';
      },
      
      removeAttr:function() {
        this.roleVal = '';
      },
      checkAttr:function() {
        alert(this.roleVal);
      }
    });

  document.addEventListener('DOMContentLoaded', function() {
    ng.platform.browser.bootstrap(app.AppComponent);
  });
})(window.app || (window.app = {}));

0 comments:

Blogroll

Follow this blog by Email

Popular Posts