我正在学习AngularJS,并尝试制作sime重定向应用程序。我有dxTreeView(使用devExtreme组件)的index.html。我的目标是单击TreeView菜单中的项目以加载不同的视图。
这是我的index.html的示例:
<body class="dx-viewport">
<div class="container" ng-app="MainContainer" ng-controller="MainController">
<div class="left-content">
<div id="simple-treeview" dx-tree-view="treeViewOptions"></div>
</div>
<div class="right-content">
<div data-options="dxView: {name: 'mainView', title: 'Main View'}" id="right-view">
</div>
</div>
</div>
index.js:
MainApp.controller("MainController", function MainController($scope) {
$scope.treeViewOptions = {
dataSource: treeLoginOption,
selectionMode: "single",
selectByClick: true,
displayExpr: "name",
keyExpr: "name",
onItemClick: function (e) {
var viewType = e.itemData.type;
if (viewType == "Login") {
$("#right-view").load("../views/" + viewType + ".dxview");
LoginController(); !!!!Here is my problem !!!
rebuildMenu();
}
else
{
$("#right-view").load("../views/" + viewType + ".html");
}
}
} });
我需要调用另一个html页面,该页面具有带有另一个控制器的.js文件。用我的方法,该页面被调用,但不带控制器的.js文件。
Login.html:
<div class="form" ng-controller="LoginController">
<div class="dx-fieldset">
<div class="dx-fieldset-header">Přihlášení uživatele</div>
<div class="dx-field">
<div class="dx-field-label">Jméno</div>
<div class="dx-field-value">
<div dx-text-box="textBox.name" id="textBox.name"></div>
</div>
</div>
<div class="dx-field">
<div class="dx-field-label">Heslo</div>
<div class="dx-field-value">
<div dx-text-box="textBox.password" id="textBox.password"></div>
</div>
</div>
</div>
</div>
和Login.js:
MainApp.controller('LoginController', function ($scope) {
console.log("Login page generate called.");
$scope.textBox = {
name: {
placeholder: "Jméno",
visible: true
},
password: {
placeholder: "Heslo",
mode: "password",
visible: true
}
}; });
我真的很希望您的帮助。感谢您的建议。