acces javascript var in template angular 2

Question

I have a angular app with a few settings defined in my index.php:

 <script>
    Setting = { imagepath : "some/path/", setting2: 1}
 </script>

 <myapp>

 </myapp>

Now I want to acces this image path variable in one of my templates so that the img path can always be changed without trouble. How can I pass the settings object to my angular template so I can use

<img [src]="settings.imagePath+'/myimage.png'>

Günter Zöchbauer · Accepted Answer · 2016-08-19 10:57:47Z

2

In template bindings the scope is limited to the components class instance.

If you want to access it from template bindings anyway you need to add a method or getter to your component class that returns that value.

This should do what you want:

 <script>
    window.Setting = { imagepath : "some/path/", setting2: 1}
 </script>

export class MyComponent {
  get settings() {
    return window.Settings;
  }
}

<img [src]="settings.imagePath+'/myimage.png'>

answered Aug 19, 2016 at 10:57

Günter Zöchbauer

662k235 gold badges2.1k silver badges1.6k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

acces javascript var in template angular 2

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related