编辑 我找到了一个解决方案并发现了一个奇怪的问题:问题是组件名称“ tdManagement”在大写字母之前只有两个小写字母,实际上,如果我输入三个小写字母,则一切正常。让我知道您是否遇到同样的情况,这是众所周知的问题还是错误。
我正在使用路由到组件的功能来开发一个简单的AngularJS应用程序;一切正常,除了我尝试更改状态并加载另一个组件时:浏览器的url更改了,但是模板(通常是组件)未加载
这是文件 app.route.js
angular.module("gestioneDocumentale")
.config(["$urlRouterProvider", "$stateProvider", function($urlRouterProvider, $stateProvider) {
$urlRouterProvider.otherwise("/home");
var homeState = {
name: "home",
url: "/home",
component: "paramSelect",
resolve: {
ambienti: function(ParamService) {
return ParamService.getAmbienti();
},
banche: function(ParamService) {
return ParamService.getBanche();
},
applicativi: function(ParamService) {
return ParamService.getApplicativi();
},
oggettiBusiness: function(ParamService) {
return ParamService.getOggettiBusiness();
}
}
};
var templateState = {
name: "templateManagement",
url: "/templateManagement",
component: "tdManagement",
params: {
obj: null
}
};
$stateProvider.state(homeState);
$stateProvider.state(templateState);
}]);
这是第一个正确加载的组件,我使用$ state.go()更改了状态:
angular.module("gestioneDocumentale")
.component("paramSelect", {
controller: ["$state", function($state) {
this.selectedAmbiente = "";
this.selectedBanca = "";
this.selectedApplicativo = "";
this.selectedBusinessObject = "";
this.showMenu = false;
this.changeHandler = function() {
if (this.isSelectionValid())
this.showMenu = true;
}
this.isSelectionValid = function() {
if (this.selectedAmbiente === "" || this.selectedBanca === "" || this.selectedApplicativo === "")
return false;
return true;
}
this.changeMod = function() {
var inputParams = {
ambiente: this.selectedAmbiente,
banca: this.selectedBanca,
applicativo: this.selectedApplicativo
}
$state.go('templateManagement');
}
}],
templateUrl: "app/components/mod1/paramSelect/paramSelect.template.html",
bindings: {
ambienti: "<",
banche: "<",
applicativi: "<",
oggettiBusiness: "<"
}
})