CODEWITHSUNDEEP
angulartypeerror
user1298781
user1298781

Reputation: 23

Angular 2 DOM adapter

Try to use DOM adapter like this:

import { DOM } from 'angular2/src/platform/dom/dom_adapter';
DOM.addClass(DOM.query("body"), 'test');

But get an error

ORIGINAL EXCEPTION: TypeError: dom_adapter_1.DOM is null ...

in the generated code dom_adapter_1.DOM is null, but dom_adapter_1.default.DOM not null and work fine.

(angular2: "2.0.0-beta.8")

To workaround I added to "angular2/src/platform/dom/dom_adapter.d.ts" this func: "export declare function DOM2(): DomAdapter;", and simple implementation in angular.js (function DOM2(){ return this.default.DOM;})

now I use it like:

import { DOM2 } from 'angular2/src/platform/dom/dom_adapter';
DOM2().addClass(DOM2().query("body"), 'test');

Upvotes: 2

Views: 5351

Answers (2)

micronyks
micronyks

Reputation: 55443

I don't understand your question completely. But you can use BroswerDomAdapter like this. (Only if it helps you)

import {Component} from 'angular2/core';
import {BrowserDomAdapter} from 'angular2/platform/browser';
//import { DOM } from 'angular2/src/platform/dom/dom_adapter';
@Component({
    selector: 'my-app',
    template: `
    <style>
      .test{
        color:green;
      }
    </style>
    <button (click)="add()">Add New Element</button>
    `
})
export class AppComponent {
 dom:BrowserDomAdapter;
  constructor() { 
    this.dom = new BrowserDomAdapter();
  }
  add(){
     this.dom.addClass(this.dom.query("button"),"test");
  }
}

working Demo

Upvotes: 3

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657741

This is a known issue with DOM in TypeScript https://github.com/angular/angular/issues/6904

Upvotes: 0

Related Questions