Question

我遇到的问题是loadjs文件在将其绑定到网格之前并不总是被加载。我已经阅读了有关使用指令的其他帖子，但我不明白如何在我的情况下使用它们。

代码应该加载一个特定的视图，每个视图依次有一个特定的javascript文件，需要在最终导入视图之前加载

因此，视图1可能是具有datagrid.js文件依赖性的数据网格，而view2是具有listview.js依赖性的列表视图

感谢。

Function MyCtrl1($scope) {
$scope.$on('$viewContentLoaded', function() {

     //Load file if not already loaded
    isloadjscssfile("js/model/gridmodel.js", "js")


  $("#grid").kendoGrid({
                    dataSource: getdatasource(),
                    pageable: true,
                    height: 400,
                    toolbar: ["create"],
                    columns: [
                        "ProductName",
                        { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "150px" },
                        { field: "UnitsInStock", title:"Units In Stock", width: "150px" },
                        { field: "Discontinued", width: "100px" },
                        { command: ["edit", "destroy"], title: "&nbsp;", width: "210px" }],
                    editable: "inline"
                });
});

}

Answer 1

你做不到。 Angular不会从模板加载javascript部分。

无论如何，您应该将它们包含在主应用程序中。应用程序启动时应加载所有控制器。（这是你放置npApp指令的地方）

Answer 2

尝试这样的事情（它可能是“更多角度”，但目前它适用于我）：

angular.module('MyApp').controller('MyCtrl1', ['$scope', function ($scope) {

    window.initialize = function() {
        // code to execute after your JS file referenced in the loadScript function loads
    }

    var loadScript = function () {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'http://www.myserver.com/file.js?callback=initialize';
        document.body.appendChild(script);
    }

    $scope.$on('$viewContentLoaded', function () {
        loadScript();
    });

}]);

Answer 3

如果你想在指令中这样做，你可以做这样的事情

.directive('require', function(){
    return{
      restrict: 'E',
      scope: {
         scriptSrc: '@'
      },
      template:'<script type="text/javascript" src="{{ scriptSrc }}"></script>',
      link: function(scope, elm, attr){
        ....
      }
      replace: true
    }
});

HTML：

<require script-src="/foo.js">
<require script-src="/bar.js">

如何包含特定于每个视图angularjs的javascript文件

3 个答案: