angularjs内部内部javascript局部视图不起作用？

Question

这里的主要事情是避免在index.html中加载所有JavaScript

例如，我对日期选择器有局部看法。 初始化将在局部视图侧进行。

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

通过路由器加载部分视图时，将不会执行上述脚本。 如何在angularjs部分视图内执行这类内部javascript？

Answer 1

Angular解析DOM，因此，如果将script标签放入其中，显然将无法正常工作。 您应该为日期选择器创建一个指令，并在您的局部视图中使用该指令，例如<div date-picker> 。 另外，您可以在控制器中添加这段JavaScript，但我不建议这样做。 一旦习惯了，创建指令就非常容易。 您的日期选择器可能已经可以作为指令使用。 对它进行Google搜索。

Answer 2

感谢Erik Duindam。

创建了angularjs指令，如下所示

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

在部分视图html文件中，我使用了created指令

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

现在，jQuery日期选择器已在部分视图中初始化。 工作很棒！