-1

我在我的應用中試圖包含一個包含其他模板的模板（已經顯示）。Angular使用ng-include包含一個包含其他模板

的index.html

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Tasks Overview</title> 

    <!-- Angular framework --> 
    <script src="assets/js/angular.min.js"></script> 

    <!-- Main module --> 
    <script src="app.js"></script> 

    <!-- Components --> 

    <!-- Services --> 
    <script src="app/components/logger/logger-service.js"></script> 
    <script src="app/components/resource/resource-service.js"></script> 
    <script src="app/components/integrity_check/integrity_check-service.js"></script> 
    <script src="app/components/date_utilities/month_translation_utility-service.js"></script> 

    <!-- History --> 
    <script src="app/components/history/history-controller.js"></script> 

    <!-- Period --> 
    <script src="app/components/period/period-controller.js"></script> 
    <script src="app/components/period/directives/year_picker/year_picker-directive.js"></script> 
    <script src="app/components/period/directives/month_picker/month_picker-directive.js"></script> 

    <!-- Shell --> 
    <script src="app/components/shell/shell-controller.js"></script> 

    <!-- Calendar --> 
    <script src="app/components/calendar/directives/day/day-directive.js"></script> 
    <script src="app/components/calendar/calendar-controller.js"></script> 

    <!-- UI libraries --> 
    <link rel="stylesheet" type="text/css" href="assets/css/materialize.min.css"> 
    <link rel="stylesheet" type="text/css" href="assets/css/system.css"> 
    <script src="assets/js/jquery-3.1.0.min.js"></script> 
    <script src="assets/js/materialize.min.js"></script> 

    <!-- Task entities --> 
    <script src="app/components/task/task-controller.js"></script> 
    <script src="app/components/task/tasks-service.js"></script> 

    <!-- Main --> 
    <script src="app/components/main/main-controller.js"></script> 

    <!-- Google material icons --> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" 
     rel="stylesheet"> 

    <!-- External libraries --> 
    <script src="assets/js/FileSystem.js"></script> 

</head> 
<body ng-app="wtd"> 

    <!--History component--> 
    <div id="history" ng-include="'app/components/history/history_main-view.html'" ng-controller="historyController as vm"></div> 

    <!--Period component--> 
    <div id="period" ng-include="'app/components/period/period_main-view.html'" ng-controller="periodController as vm"></div> 

    <!--Calendar component--> 
    <div id="calendar" ng-include="'app/components/calendar/calendar_main-view.html'" ng-controller="calendarController as vm"></div> 

    <!--Shell component--> 
    <div id="shell" ng-include="'app/components/shell/shell_main-view.html'" ng-controller="shellController as vm"></div> 

    <!--Main controller--> 
    <div id="main" ng-controller="mainController"></div> 

</body> 
</html>

calendar_main-view.html

<div class="col l10 offset-l1 m10 offset-m1 s10 offset-s1"> 

<!-- List view mode --> 
<div ng-if="view.mode.list" ng-include="app/components/calendar/calendar_list-view.html"> 

</div> 

<!-- Grid view mode --> 
<div ng-if="view.mode.grid" ng-include="app/components/calendar/calendar_grid-view.html"></div> 

</div>

問題出現在第二級NG-包括（文件calendar_grid-view.html）。沒有人通過瀏覽器進行xhr調用以包含文件。

怎麼了？

來源

2016-09-21 Simone Campagna

您缺少單引號。

<div ng-if="view.mode.list" ng-include="'app/components/calendar/calendar_list-view.html'"> 

<div ng-if="view.mode.grid" ng-include="'app/components/calendar/calendar_grid-view.html'"></div>

確保view.mode.list和view.mode.grid evaluted以顯示HTML到truthy。

來源

2016-09-21 18:08:20

是的，你是對的RIYAJ。謝謝 –

如果它的工作，然後關閉quetition。 –

我無法看到標籤下的緊密鏈接RIYAJ :( –

Angular使用ng-include包含一個包含其他模板

calendar_main-view.html

回答

相關問題