CODEWITHSUNDEEP
angulartypescriptangular6
core114
core114

Reputation: 5325

'imgAreaSelect' does not exist on type

I found some example but that one is not a angular example here and I tried to created my angular 6 project for the some image area selector but its not working correctly,i faced this error

.component.ts(64,16): error TS2339: Property 'imgAreaSelect' does not exist on type '"#bee"'.

anyone know how to put this one in Angular 6

stackblitz here

Thanks in advance

component.html

<div id="bee">
<img src="/assets/sg-img/documents/test-2.jpg" width="100%;">
        <!--- documents-->
</div>

component.ts

ngOnInit() {

     {
      ('#bee').imgAreaSelect({ aspectRatio: '1:1', handles: true });
    };
  }

.css

/*image area*/


.imgareaselect-border1, .imgareaselect-border2,
.imgareaselect-border3, .imgareaselect-border4 {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.imgareaselect-handle {
  background-color: #fff;
  border: solid 1px #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.imgareaselect-outer {
  background-color: #000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.imgareaselect-selection {
}

Upvotes: 0

Views: 151

Answers (1)

Antoniossss
Antoniossss

Reputation: 32517

First you have to include JQuery as project dependency. This part is done here https://stackblitz.com/edit/angular-ggtn2q?file=src%2Findex.html

Later on you have to include required plugin as static asset and include it as sources. This cannot be done on stackblitz. Required pligin sources you can get here https://cdnjs.com/libraries/imgareaselect

Here is explained how to include jquery plugin https://medium.com/all-is-web/angular-5-using-jquery-plugins-5edf4e642969

Upvotes: 1

Related Questions