如何包含特定於每個視圖的javascript文件angularjs

我遇到的問題是loadjs文件在綁定到網格之前並不總是被加載。我已閱讀其他職位有關使用指令，但我不明白如何在我的情況下使用它們。如何包含特定於每個視圖的javascript文件angularjs

代碼應該加載特定視圖依次在每個視圖中有需要的視圖最後renered

前

所以圖1可能與datagrid.js文件扶養和視圖2 DataGrid中要加載特定的JavaScript文件是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" 
       }); 
});

}

來源

2012-09-15 dan

沒有幫助你的疑問句但你不應該在你的控制器中訪問DOM，你應該寫一個kendoGrid指令來處理它，參見http://docs.angularjs.org/guide/dev_guide.mvc.understanding_controller（正確使用控制器部分） – Guillaume86

你不能。 Angular不會從模板加載JavaScript部件。

你應該做的是將它們包含在主應用程序中。所有的控制器應該在主應用啓動時加載。（這是你把你的npApp指令）

來源

2012-09-15 12:13:15

所以如果我有20個視圖，而不是能夠動態加載每個視圖的JS文件我必須將src = mygrid.js硬編碼到我的main.html頁面??我必須誤解，因爲這會導致每個頁面加載的javascript都不需要該視圖。 – dan

還有其他一些方法可以動態加載JavaScript文件，但這不在角度範圍內。如果你有20個視圖它對應於20個控制器，它可能是一個大文件，具體取決於控制器，但如果你有共享方法，請查看http://docs.angularjs.org/guide/dev_guide.mvc.understanding_controller（Section Controller Inheritance ）。或者你可以根據你的需要創建一個服務 –

ok，所以在上面的例子中，我使用isloadjscssfile動態加載文件，該文件將文件添加到標題，但使用viewContentLoaded事件綁定到網格，但它不保證大小該文件被加載。在我的代碼中，我應該放置isloadjscssfile（「js/model/gridmodel.js」，「js」）方法，以及在哪裏放置綁定網格$網格代碼。看來內容加載是爲了延遲事件才能正常工作。我需要的是這樣一個地方，如果view1在doc.ready加載文件之前，然後在doc.ready綁定到網格 – dan

嘗試是這樣的（它可能可能是「更加棱角分明」，但目前它爲我的作品）：

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(); 
    }); 

}]);

來源

2013-11-27 23:54:38

如果你想這個在指令中，你可以做這樣的事情

.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">

來源

2014-04-02 05:18:49 a8m

之前，那麼它不工作，該腳本沒有按時加載並且控制器無法訪問。 –

如何包含特定於每個視圖的javascript文件angularjs

回答

相關問題