Question

我在Angualr中制作前端，在Rails中制作后端。我想在另一个视图中嵌入一个视图。以下结构是我目前正在做的事情。

//index.html
<head>
<scrip src="path/MainController.js"></script>
<scrip src="path/controller1.js"></script>
<scrip src="path/controller2.js"></script>
<head>

<body ng-controller="MainController">
  <div ng-view></div>
</body>

//app.js
var app;
app = angular.module('App', ['ngRoute']);

app.config(['$routeProvider',
    function ($routeProvider) {
    $routeProvider
            .when('/page1', {
                templateUrl: 'path/page1.html',
                controller: 'controller1'
            }).when('page2', {
            templateUrl: 'path/page2.html',
            controller: 'controller2'
        })
}]);

没错，我正在尝试将page2.html嵌入到page1.html中。我可以复制＆amp;将page2.html的代码粘贴到page1.html中，但我想将视图分开。 page1.html需要controller1，page2.html需要controller2。这意味着我需要以某种方式将controller2加载到page1.html中。

我很想知道如何实现这一目标！

Answer 1

您可以按照这种方式使用 ng-include

包含page.html内的page2.html

<强> Page1.html

<div id="page-wrapper">        
    <div class=" ng-include="'views/common/Page2.html'" ng-controller="PagesecondController"></div>
    <!-- /#page-wrapper -->
    <div id="page-content-wrapper" ui-view></div>
</div>

供参考http://embed.plnkr.co/pARExi/

Answer 2

看看How to make Angularjs nested routes?。它显示了创建嵌套路由的示例，它允许您将page2嵌入到page1中。

使用Angular和ng-route在另一个视图中嵌入视图

2 个答案: