javascript - 在模板 angular 2 中访问 javascript var

Question

我有一个 Angular 应用程序，在我的 index.php 中定义了一些设置:

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

 <myapp>

 </myapp>

现在我想在我的一个模板中访问这个图像路径变量，这样 img 路径总是可以毫无问题地更改。如何将设置对象传递给我的 Angular 模板以便我可以使用

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

Answer 1

在模板绑定(bind)中，范围仅限于组件类实例。

如果您无论如何都想从模板绑定(bind)访问它，您需要向返回该值的组件类添加一个方法或 getter。

这应该做你想做的:

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

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

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