javascript - 如何从html调用javascript函数？

Question

我有以下代码:

<ion-content>
    <ion-list>
      <ion-item ng-repeat="x in names|orderBy:'order_id'">
        {{ x.order_id + ', ' + x.table_id+', '+x.name+', '+x.phone+', '+x.address+', '+x.remark+', '+myFunction(x.ctime)}}
      </ion-item>
    </ion-list>
  </ion-content>

我想调用 myFunction 并获取返回值，但不起作用。

<script type="text/javascript">
function myFunction(ctime) {
    alert("Hello World!");

    // create a new javascript Date object based on the timestamp
    // multiplied by 1000 so that the argument is in milliseconds, not seconds
    var date = new Date(ctime*1000);
    // hours part from the timestamp
    var hours = date.getHours();
    // minutes part from the timestamp
    var minutes = "0" + date.getMinutes();
    // seconds part from the timestamp
    var seconds = "0" + date.getSeconds();

    // will display time in 10:30:23 format
    var formattedTime = hours + ':' + minutes.substr(-2) + ':' + seconds.substr(-2);
    console.log("debug",formattedTime);
    return formattedTime;
}

</script>

我想知道问题出在哪里。谢谢。

Answer 1

页面中附加的脚本的顺序以及正在计算的表达式可能是问题所在。

无论如何，不​​建议直接在 html 文件中创建全局 JavaScript 函数。您正在使用AngularJS，您可以使该函数在相关范围中可用，它会自动为您处理这个问题。

<小时/>

您必须有一些 Controller ，您可以在其中声明对象数组names，它必须类似于:

myApp.controller('NamesCtrl', ['$scope', function($scope) {
  $scope.names = [{order_id: 1, table_id: 4, name: "Someone"}];
}]);

只需将您的 myFunction 添加到 Controller 的范围，例如:

myApp.controller('NamesCtrl', ['$scope', function($scope) {
  $scope.names = [{order_id: 1, table_id: 4, name: "Someone"}];

  $scope.myFunction = function myFunction(ctime) {
    alert("Hello World!");

    // create a new javascript Date object based on the timestamp
    // multiplied by 1000 so that the argument is in milliseconds, not seconds
    var date = new Date(ctime*1000);
    // hours part from the timestamp
    var hours = date.getHours();
    // minutes part from the timestamp
    var minutes = "0" + date.getMinutes();
    // seconds part from the timestamp
    var seconds = "0" + date.getSeconds();

    // will display time in 10:30:23 format
    var formattedTime = hours + ':' + minutes.substr(-2) + ':' + seconds.substr(-2);
    console.log("debug",formattedTime);
    return formattedTime;
  };
}]);

调用函数所用的表达式无需更改。

如果您想了解有关此概念的更多详细信息，您可以查看 here .

<小时/>

如果您仍然选择将脚本保留在 html 页面中，您可以尝试在表达式之前包含该脚本并检查是否可以解决问题。

如果您仍有任何问题，请随时发表评论。