Question

我想在Angular2或Angular4中调用内联Javascript函数。

以下是我的示例代码。

*。HTML

<div id="demo" onload="myfunction()"></div>

<script>
  function myfunction() {
console.log("working");
   var map = new AMap.Map("map", 
     { resizeEnable: true, 
      center: [latitude, longitude], 
      zoom: 8
     }); 
}
</script>

这是正确的方法吗？现在不行。

我使用的是Amap.map API。我不认为它会支持Angular2。如果它支持我会像往常一样调用组件中的typescript函数。现在我想在视图中绑定地图。所以我需要发布这个

var map = new AMap.Map("map", 
 { resizeEnable: true, 
   center: [latitude, longitude], 
   zoom: 8
 });

但由于无法导入错误而导致错误＆＃34; AMap＆＃34;

注意：由于第三方库，我应该尝试这样的内联（内联javascript）。

Answer 1

在index.html中将下面的行放在标记中。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">    
</script>

它将在您的项目中包含JQUERY。然后在tyescript文件中，您可以根据您的要求包含您的逻辑

对于Ex：

在您的组件的html文件中

<div id="demo"> 
    <!-----Code-------->
 </div>

在组件

的打字稿文件中

 ngOnInit(){
      $(document).ready(function () {
          $('#demo').load(() => {
              // Your function Body
              console.log("working");
              var map = new AMap.Map("map", 
               { resizeEnable: true, 
                  center: [latitude, longitude], 
                  zoom: 8
                }); 
          })
       }
 }

如果您在添加jquery库时遇到任何问题，还有其他方法可以使用它。

Answer 2

See this resource that is telling you:

几乎所有HTML语法都是有效的模板语法。 <script>元素是一个值得注意的例外;它是被禁止的，消除了风险脚本注入攻击。实际上，<script>被忽略了警告出现在浏览器控制台中。

如何在Angular2中调用内联javascript函数？

2 个答案: