Question

我有ng-repeat list和ng-view：

<div ng-controller="TabCtrl">
    <ul>
        <li ng-repeat="tab in tabs">
            <a href="#/{{tab.page}}">{{tab.title}}</a>
        </li>
    </ul>
     <div ng-view></div>
</div>

routeProvider：

angular.module("sampleApp", ['ngRoute'], 
function($routeProvider) {
    $routeProvider

    .when('', {
        templateUrl: 'tabs/main.html',
        controller: MainCtrl
    })
    .when('/main', {
        templateUrl: 'tabs/main.html',
        controller: MainCtrl
    })

    .when('/main/model/:url', {
        templateUrl: 'tabs/modelPage.html',
        controller: modelCtrl
    })
});

main.html中：

<div>
<h1>Main</h1>
<ul>
    <li ng-repeat="model in models">
        <a href="#/main/model/{{model.url}}">{{model.name}}</a>
    </li>
</ul>
<div ng-include="content"></div>

和控制器MainCtrl：

function MainCtrl($scope, $location, $http){
$scope.content = "main_main.html";
$http.post('get_data.php', {action: 'get_models'})
.success(function(data){
    $scope.models = angular.fromJson(data);
});

}

我想获取modelPage.html而不是main.html，但ng-view不适用于此。如何实现这段代码？

Answer 1

我可能没理解你的问题，但似乎你错过了JS中的'modelCtrl'控制器（或者你的问题细节中没有显示）。

您的$ routeProvider

angular.module("sampleApp", ['ngRoute'], 
function($routeProvider) {
    $routeProvider

    ...

    .when('/main/model/:url', {
        templateUrl: 'tabs/modelPage.html',
        controller: modelCtrl
    })
});

添加'modelCtrl'

function modelCtrl($scope, $location, $http){
    ...
});

如何在ng-view中加载页面

1 个答案: