angularjs 部分视图中的内部 javascript 不起作用

Internal javascript inside angularjs partial view is not working?

本文关键字:内部 javascript 不起作用 视图 angularjs      更新时间:2023-09-26

这里的主要内容是避免加载索引中的所有JavaScript.html

例如)我有日期选择器的部分视图。初始化将在部分视图侧。

<script>
$(function() {
   $('.date-pick').datePicker();
});
</script>

当通过路由器加载部分视图时,不会执行上述脚本。如何在angularjs部分视图中执行这些内部JavaScript?

Angular 解析 DOM,所以如果你在里面放一个脚本标签,这显然是行不通的。您应该为日期选择器创建一个指令,并在分部视图中使用该指令,如<div date-picker>。或者,您可以在控制器中添加这段JavaScript,但我不推荐它。一旦你习惯了它,创建一个指令就很容易了。您的日期选择器可能已经作为指令提供。对它进行谷歌搜索。

谢谢 Erik Duindam。

创建了 angularjs 指令,如下所示

// Directive for jQuery datepicker intialization
app.directive('jqueryDatepicker', function () {
   return {
    restrict: 'A',
    link: function (scope, element, attr) {
       $('.date-pick').datePicker();
    }
  }
});

在部分视图 html 文件中,我使用了创建的指令

<input name="date1" jquery-datepicker id="date1" class="date-pick"/>

现在,jQuery 日期选取器已在分部视图中初始化。工作很棒!