如何在AngularJS中動態地將控制器綁定到生成的HTML頁面？

到目前爲止，我有能力用PHP代碼生成新的HTML頁面。我已經有了一些頁面，但是隻需點擊一下按鈕即可生成新的頁面。它以這樣一種方式進行設置，即它將所有信息存儲在JSON文件中：文件名，角路由提供程序的「何時」組件，templateUrl和控制器名稱。如何在AngularJS中動態地將控制器綁定到生成的HTML頁面？

這裏是JSON文件的例子：

{ 
    "pages": [ 
    { 
    "name": "index", 
    "when": "/", 
    "controller": "indexController", 
    "template": "views/index.html" 
    } 
    ] 
}

我需要以某種方式將控制器綁定到這些生成的網頁，讓他們將指向我的HTML代碼NG-視圖。

我HTML代碼有這樣的：

<div ng-view class="{{pageClass}}"></div>

我靜態角代碼有這個（手動寫的，不是動態生成）：

app.config(function($routeProvider){ 
$routeProvider. 
when('/', { 
    templateUrl: '/views/index.html', 
    controller: 'indexController' 
}); 
app.controller('indexController', function($scope) { 
    $scope.pageClass = 'index'; 
});

控制器允許我插入索引.html模板添加到class =「{{pageClass}}」的ng-view部分。（I還也可以使用納克級=「{pageClass}」）

然而，現在，我生成的網頁動態，其不寄存器控制器和結合所述模板向pageClass：

var app = angular.module('myApp', ['ngRoute']); 

var $routeProviderReference; 
app.config(['$routeProvider', function($routeProvider) { 
    $routeProviderReference = $routeProvider; 
}]); 

app.run(['$route','$http','$rootScope',function($route, $http, $rootScope){ 
    $http.get('temp.json') // load data 
    .then(function(data){ 
    var result = data.data.pages; // data from JSON file 
    var i; 
    var currentRoute; 
    for (i = 0; i< result.length; i++){ // for every existing HTML page 
     currentRoute = result[i]; 
     var routeName = currentRoute.when; 
     $routeProviderReference.when(routeName, { // assign template and controller 
     templateUrl: currentRoute.template, 
     controller: currentRoute.controller 
     }); 
    } 
    $route.reload(); 
    }); 
}]);

我得到一個錯誤，用這種方法，即使是部分作品：錯誤：[$控制器：ctrlreg]

如何綁定我的控制器，在這種情況下？它應該是這樣的：

app.controller(currentRoute.controller, function($scope) { 
    $scope.pageClass = currentRoute.name; 
});

來源

2017-08-21 Aleksey Solovey

可能重複[AngularJS如何動態添加HTML並綁定到控制器]（https://stackoverflow.com/questions/19845950/angularjs-how-to-dynamically-add-html-and-bind-to-controller ） –

好像我不得不修改控制器，把它變成一個功能：

templateUrl: currentRoute.template, 
controller: function($scope) { 
    $scope.pageClass = currentRoute.name; 
}

這將選定的頁面粘貼到NG-鑑於內pageClass

來源

2017-08-22 14:11:56

如何在AngularJS中動態地將控制器綁定到生成的HTML頁面？

回答

相關問題